在使用动态内容时,如何使用react路由器更新URL路径?

时间:2016-05-24 19:27:57

标签: javascript reactjs react-router redux

我试图弄清楚如何根据我的反应应用中的用户导航来更新我的网页网址。我正在使用Redux和React Router。

当用户登陆应用程序时,应用程序通过AJAX从服务器加载数据。让我们说这是一个动物名单:

dog
cat
fish
pig
cow

我的路由器结构如此(简化为重要部分):

<div>
  <Provider store={store}>
    <Router history={hashHistory}>
      <Route path="/animal/:currentAnimal" component={ConnectedEntityStack} />
    </Router>
  </Provider>
</div>

用户可以左右滑动以接触不同的动物,或直接在mywebsite.com/animal/dog找动物。

目前我已直接登陆动物工作..而且我已经刷了工作。但是,当我更换动物时,URL不会更新。

当&#34;路由&#34;时,如何使用反应路由器获取更新的URL?是动态值(并没有硬编码到路由器中)?

1 个答案:

答案 0 :(得分:0)

如果你使用react-router-redux,你可以用这种方式更新url:

import { push } from 'react-router-redux';

pushUrl = (newUrl) => {
  const { dispatch } = this.props;
  dispatch(push(newUrl));
}