奉化市建设局网站,wordpress自定义参数查询,微信小程序入门开发,企业网站建设 调研在看 React 示例时#xff0c;发现在配置路由时很多都用到了 exact 属性#xff0c;然后就研究了一下。
在 React Router 中#xff0c;exact 是一个布尔属性#xff0c;用于确保路由路径的精确匹配。
示例
import { BrowserRouter as Router, Route, Switch } from rea…在看 React 示例时发现在配置路由时很多都用到了 exact 属性然后就研究了一下。
在 React Router 中exact 是一个布尔属性用于确保路由路径的精确匹配。
示例
import { BrowserRouter as Router, Route, Switch } from react-router-dom;
import Home from ./components/Home;
import About from ./components/About;const App () {return (RouterSwitchRoute exact path/ component{Home} /Route path/about component{About} //Switch/Router);
};export default App;
上述示例中在第一条路由中用到了 exact表示精准匹配如果不写的话那么在匹配路由 “/about” 时会匹配到路由 “/”这样就会造成组件匹配错误。
尝试
然后我就在我的 React 项目中试了一下没有出现上述的问题添加或删掉 exact 对我的项目没有任何影响查阅了一些资料才发现是 React Router 版本的问题
在 React Router 版本 5 及之前的版本中需要关注这个属性因为它的默认行为为 false如果没有显示的设置为 true路由将会进行模糊匹配即只要路径部分匹配就会渲染对应的组件。但是在 React Route 版本 6 中exact 属性已被移除路由的默认行为改为了精准匹配只有在当路径与 URL 完全匹配时才会渲染组件。
总结
如果版本在 v6就不需要关注 exact 属性啦。
