Question

我试图渲染诸如whatsapp之类的东西，在主屏幕中，您已经渲染了所有组，当您单击一个组时，一条新路线变为活动状态，并且主屏幕被禁用，我希望当用户单击组时（它当然是一个对象）那么将响应该事件的路由将以某种方式将包含的组件的组对象获取到组。

为您显示代码说明：

在groupsScreen组件中，每个单个组组件都获得一个与其相关的组对象，在主屏幕中的组表示中，您可以单击它，它会将您转到/ conversation_area，现在我知道我可以在url中传递该组的名称，然后遍历this.state.groups，这将工作，但我想知道是否有更好的方法来链接和路由之间进行通信...

group组件很简单，只是一个在其props中获得一个group对象的组件，并且它包装了group的所有设计。

非常感谢！

Answer 1

如果组处于状态，则可以过滤状态以仅传递您想要的值。

<Route exact path="/conversation_area/:group_id" render={props => {
    // filter out the object that you need from the groups.
    const group = props.find(group => props.match.params.group_id === group.id)

    // you now have access to that group information.
    return (
        <h1>bla bla</h1>
)}} />

我将在这里重组代码，并使用组件属性来传递组件。保持“路由”简单易行，以后将为您节省很多麻烦。

将参数传递给没有react-router-dom中url的路由

1 个答案: