通过react-router <link />传递道具的最佳做法是什么？

Question

我使用react-router4。我想通过Link组件将几个道具传递给我的一个表单组件来初始化状态。我找到了两种方法： 通过state传递。

<Link to={{pathname:'/orders/', state:{prop1: 'p1', prop2: 'p2', prop3: 'p3'}}} />

通过将网址更改为/orders/:prop1/:prop2/:prop3

，通过查询参数路径

<Link to='/orders/p1/p2/p3' />  

充分了解如何正确使用它的最佳做法和建议。我想知道有没有建议如何通过<Link />组件传递道具 什么时候我应该使用查询参数和状态？

Answer 1

这取决于您正在构建的应用类型以及导航到下一个组件时是否已经拥有所有必需的props？

例如，如果应用依赖于外部API来获取订单详细信息。在orders页面上，我更喜欢使用<Link to='/orders/1235' />并根据收到的pathname获取订单号。原因是因为在orders页面中，我还没有关于orderId 1235的所有详细信息。

对于我使用state传递的大多数情况，通常只会切换用户界面。

<Link to={{pathname:'/home/', state:{newUser: true} }}/>

所以在我的组件中，我有一些东西可以检查是否newUser，我会显示一条指令横幅。