javascript - 为什么程序员在 React 路由中使用组件属性？

Question

我现在正在学习react。我发现程序员在react中路由时通常会使用组件属性。因此，为了路由名为 Menu 的组件，他们编写如下代码

<Route exact path='/menu' component={ Menu } />

而不是

<Route exact path='/menu'> <Menu /> </Route>

我认为在向 Menu 组件提供 props 时，第二种方式要方便得多。所以我的问题是，作为第一种方式编写代码有什么好处？

谢谢。

Answer 1

一切都与用例有关。我们可以通过以下方式声明路由:

1. 组件

   <Route to="/home" component={Home} />
   

   当您不想拥有将任何 Prop 传递给组件的控制权时，可以通过这种方式添加路由，只需将组件对象作为 Prop 传递给路由即可。

2. 渲染

   <Route to="/home" render={props => <Home {...props} />} />
   

   当想要控制将任何 Prop 传递给组件甚至更新现有组件 Prop 时，可以通过这种方式添加路由。

3. child

   <Route exact path='/home'> <Home/> </Route>
   

   这是将路由组件作为子组件传递给路由组件的另一种方法。您可以再次传递 props 或者将组件包装到另一个组件或某些 html 结构中。

选择一个解决方案只是开发人员的选择。如今，开发人员使用许多方法或框架来在 React 应用程序中引入路由。我个人喜欢第一个，因为它很干净，确保 Prop 类型并对任何违规发出警告，而且我没有在路线级别传递用例或 Prop 。