Question

我有一个带有表格的页面，您单击<tr>，然后用户被重定向到另一个页面，如下所示：

// parent component
<tr onClick={() => this.props.history.push(`users/${id}`)}>

在名为用户的新页面上，有两个选项卡也重定向到其他页面：

// users page receives the id from the parent 
// component with this.props.history.push()
<Tab label='Users' key='users'>
    <div>users page content</div>
</Tab>

// This page must also receive the id from parent component. 
// The structure is similar to users page.
<Tab label='Info' key='info'>
    <Redirect to={'/info/:id'} />
</Tab>

因此，我需要将父页面的ID传递给[信息页面/选项卡2]，并随意将[信息页面/选项卡2]重定向到[用户/选项卡1]，并附上父代的ID，例如这个：

[tab 1]: users/12345
[tab 2]: info/12345

如何获得此结果？谢谢！：）

Answer 1

如果您将路线定义为

/users/:userId
/info/:userId

您可以从参数中读取userID并使用它在页面之间导航

<Tab label='Info' key='info'>
    <Redirect to={`/info/${this.match.params.userId}`} />
</Tab>

带选项卡的Dynamic React Router

1 个答案: