Question

我有一个无法传统上从父组件继承props的组件。这个组件是通过路由呈现的，而不是是由父母提出的，我在谈论<Single />组件，这是＆＃39;详细信息＆＃39;此设置中的组件：

  <Router history={browserHistory}>
    <Route path="/" component={App}>
      <IndexRoute component={ProfileList} />
      <Route path="/profile/:username" component={Single} /></Route>
  </Router>

ProfileList组件中提供道具，该组件呈现Profile组件，如下所示：

   /* ProfileList render method */
   render() {
      return (
        <div>
          {this.state.profiles.map((profile, i) => 
            <Profile {...this.state} key={i} index={i} data={profile} />)}
        </div>
      );
    }

我正在尝试重用Profile和ProfileList组件中的Single组件：

  <Link className="button" to={`/profile/${username}`}>
   {name.first} {name.last}
  </Link>

但在Single组件中，我无法访问state或props - 因此我无法呈现此详细信息视图。我知道我可以use redux for passing global state或使用Link to=""

中的查询参数

但是我还没有想要联系redux，而且对查询参数感觉不对。那么如何在我的this.props.profiles组件中访问类似Single的内容？

Answer 1

redux connect（）可以完全完成这项工作。我认为你应该使用它，因为＆＃34;罚款＆＃34;你将重新实现像

这样的redux连接

如何使用反应路由器将道具传递给非子组件？

1 个答案: