时间戳

首页 > 解决方案 > 通过 Link 传递数据与在 React Router 中使用 useParams、useEffect

javascript - 通过 Link 传递数据与在 React Router 中使用 useParams、useEffect

问题描述

这方面的一个示例是带有视图链接的表。以这种方式导航到具有表格的组件

<tbody>
  <tr>
    <td>
      <Link to={`/loan-requests/${loanRequest.id}/details`}>
        <Button size="sm" variant="outline-primary">
          View
        </Button>
      </Link>
    </td>
  </tr>
</tbody>

和将用于获取数据并useParams显示useEffect

或者这样做：

<tbody>
  <tr>
    <td>
      <Link to={{path: `/loan-requests/${loanRequest.id}/details`, state={loanRequest}}}>
        <Button size="sm" variant="outline-primary">
          View
        </Button>
      </Link>
    </td>
  </tr>
</tbody>

并且状态在子组件中使用。

那么哪个更好呢？

标签： javascriptreactjsreact-router-domuse-effectreact-state-management

解决方案

我认为两种方式是等价的。对于第二种方式，“状态”是您可以通过 url 对象将数据从该组件传递到另一个页面的一种方式。参考：https ://reactrouter.com/web/api/Link

推荐阅读