通过反应路由器中的链路传递对象

kno*_*ody 30 reactjs reactjs-flux react-router

是否可以通过Linkreact-router中的组件传递对象?

就像是:
<Link to='home' params={{myObj: obj}}> Click </Link>

以同样的方式,我会通过propsParentChild组件.

如果不可能实现这一目标的最佳方式是什么:
我有一个React + Flux应用程序,我用一些数据渲染表格.我想要做的是当我点击其中一行时,它将带我到这一行的一些细节组件.这行包含了我需要的所有数据,所以我认为如果我能通过它就会很棒Link.

另一个选项是传递idurl中的行,在详细信息组件中读取它,并通过ID从商店请求数据.

不确定实现上述目标的最佳方法是什么......

kno*_*ody 32

所以我对这个问题的最终结论是我没有正确地思考它.通过我的数据传递似乎很自然,Link所以我可以在我的Child组件中访问它们.正如Colin Ramsay提到的那样,有一些东西被召唤state,Link但这不是那种方式.Link只有当用户点击某些内容并将其带到Child组件时,才能正常传递数据.

当用户访问url使用的那个问题时,就会出现问题,Link然后无法获取数据.

所以,在我的情况的解决方案是通过IDLinkPARAMS,然后检查是否我Store有数据(用户通过访问它Link),然后充分利用这些数据Store.

或者,如果数据不在Store调用中action,则从API获取数据.


小智 12

不,你不能传递一个对象params,所以我同意你的看法,你最好的计划是将id传递给商店,让商店发出一个CHANGE事件,让组件查询商店的信息.


Pix*_*omo 8

可以通过链接传递对象.在查询中添加数据而不是params并对对象进行字符串化:

<Link to={{ 
  pathname: `/blog/${post.id}`, 
  query: {
    title: post.title, 
    content: post.content,
    comments: JSON.stringify(post.comments)
  } 
}}>Read More...</Link>
Run Code Online (Sandbox Code Playgroud)

然后在您的子组件中将字符串解析回一个对象:

JSON.parse(this.props.comments)
Run Code Online (Sandbox Code Playgroud)