谁能解释一下两者的区别
<Route exact path="/" component={Home} />
和
<Route path="/" component={Home} />
我不知道exact是什么意思。
【问题讨论】：
exact 呢？”想象一个类似这样的 URL。 yourreactwebsite.com/getUsers/userId=? 这是一个用户 ID 将在 URL 中动态输入的示例，因此我们不能在此处使用路由器中的 exact 属性。
标签： reactjs react-router react-router-dom
在这个例子中，什么都没有。当您有多个名称相似的路径时，exact 参数就会发挥作用：
例如，假设我们有一个显示用户列表的Users 组件。我们还有一个用于创建用户的CreateUser 组件。 CreateUsers 的 url 应该嵌套在 Users 下。所以我们的设置可能看起来像这样：
<Switch>
<Route path="/users" component={Users} />
<Route path="/users/create" component={CreateUser} />
</Switch>
现在的问题是，当我们转到http://app.com/users 时，路由器将遍历我们定义的所有路由并返回它找到的第一个匹配项。所以在这种情况下，它会先找到Users 路由，然后返回它。都很好。
但是，如果我们转到http://app.com/users/create，它将再次遍历我们定义的所有路由并返回它找到的第一个匹配项。 React 路由器进行部分匹配，所以/users 部分匹配/users/create，所以它会再次错误地返回Users 路由！
exact 参数禁用路由的部分匹配，并确保仅当路径与当前 url 完全匹配时才返回路由。
所以在这种情况下，我们应该将exact 添加到我们的Users 路由中，以便它只匹配/users：
<Switch>
<Route exact path="/users" component={Users} />
<Route path="/users/create" component={CreateUser} />
</Switch>
【讨论】：
exact 在我看来应该是默认值
/admin//users 在 Admin 组件中，/admin/users/create 在 Root 组件中？我目前遇到这种情况，典型的exact 解决方案无法正常工作。
简而言之，如果您为应用的路由定义了多个路由，并且像这样用Switch 组件括起来；
<Switch>
<Route exact path="/" component={Home} />
<Route path="/detail" component={Detail} />
<Route exact path="/functions" component={Functions} />
<Route path="/functions/:functionName" component={FunctionDetails} />
</Switch>
然后你必须把 exact 关键字放到 Route 中，它的路径也包含在另一个 Route 的路径中。例如，主路径/ 包含在所有路径中，因此它需要有exact 关键字以将其与以/ 开头的其他路径区分开来。原因也类似于/functions路径。如果您想使用另一个路由路径，例如 /functions-detail 或 /functions/open-door，其中包含 /functions，那么您需要将 exact 用于 /functions 路由。
【讨论】：
/motor 和 /motorbike，那么您需要将 exact 放入路径为 /motor 的路线中。否则，/motor 和 /motorbike 路由都会选择路径为 /motor 的组件。
看这里：https://reacttraining.com/react-router/core/api/Route/exact-bool
精确：布尔
如果为 true，则仅当路径与 location.pathname 完全匹配时才会匹配。
**path** **location.pathname** **exact** **matches?**
/one /one/two true no
/one /one/two false yes
【讨论】：
最短的答案是
请试试这个。
<switch>
<Route exact path="/" component={Home} />
<Route path="/about" component={About} />
<Route path="/shop" component={Shop} />
</switch>
【讨论】：
exact属性/prop的含义，因此肯定不是一个“答案”。您应该尝试解决实际提出的问题，而不是为您不确定 OP 实际存在的问题提供解决方案。
请试试这个。
<Router>
<div>
<Route exact path="/" component={Home} />
<Route path="/news" component={NewsFeed} />
</div>
</Router>
【讨论】：
通过使用exact，可以确保首页组件的内容不会出现在其他页面上。
这是不使用exact的场景：
主页
位置：/
-----------------
homepage content
-----------------
第二页
位置：/第二页
-----------------
homepage content
-----------------
-----------------
second content
-----------------
============================================
使用精确：
主页
位置：/
-----------------
homepage content
-----------------
第二页
位置：/第二页
-----------------
second content
-----------------
【讨论】：
在这个例子中，什么都没有。当您有多个具有相似名称的路径时，确切的参数会起作用：
例如，假设我们有一个显示用户列表的用户组件。我们还有一个用于创建用户的 CreateUser 组件。 CreateUsers 的 url 应该嵌套在 Users 下。所以我们的设置可能看起来像这样：
【讨论】：