通行证对象反应路由器

问题描述：

我发现这个问题，这说明正是我一直在寻找...通行证对象反应路由器

Pass object through Link in react router

是否有可能通过在react-链接组件传递对象路由器？

喜欢的东西：

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

以同样的方式，我会从父到子组件通过道具。

如果它不可能实现这个目标的最佳方式是什么：我有一个React + Flux应用程序，我用一些数据呈现表格。我想要做的是当我点击其中一行时，它会带我到这一行的一些细节组件。该行有我需要的所有数据，所以我认为如果我能够通过链接传递它将会很棒。

另一种选择是传递url中行的id，在details组件中读取它，并通过ID从存储中请求数据。

不知道什么是实现上述的最佳途径......

我同意作者的结论，意思是：不是传递对象，我们应该通过一个ID。然而，我正在努力寻找下一个组件，我应该执行查找，可能在我定义mapDispatchToProps的onload方法中。

但是，我不知道如何从那里访问状态来查看对象是否处于状态，以便我可以从api调用中检索它，如果它不处于状态。这是属于这里还是属于行动？如果是在行动中，我该如何得到它。这似乎是一个非常基本的模式，我错过了一些东西。

答

您可以将其与redux-thunk一起使用，您可以为路由器执行操作。

我的意思是这样

export const boundAllStreams = (nextState, replaceState) => reqStreams(nextState.params.game);

所以你可以看到我使用PARAMS游戏，并与

export const reqStreams = game => { 

    const promise = new Promise((resolve, reject) => { 
    request 
     .get(`${config.ROOT_URL}/${game}&client_id=${config.API_KEY}`) 
     .end((err, res) => { 
     if (err) { 
      reject(err); 
     } else { 
      resolve(res.body.streams); 
     } 
     }); 
    }); 

    return { 
    type: types.RECEIVE_STREAMS, 
    payload: promise 
    }; 

};

这里，这是我的减速器在那里我得到了我的PARAMS从路由器改变状态行动。

在你需要做这样的事情之后，你绑定你的动作并使它成为一个对象。

const boundRouteActions = bindActionCreators(routeActions, store.dispatch);

最后在路由器中，你可以派遣从反应路由器

 <Route path=":game"> 
     <IndexRoute 
      component={StreamsApp} 
      onEnter={boundRouteActions.boundAllStreams} /> 
    </Route>

希望能与API的OnEnter的动作，可以帮助你）。我知道我只是向你展示代码，但我敢肯定，可以帮助你想出如何实现这一点;）

通行证对象反应路由器

相关推荐