Reactjs 如何访问URL w react redux以确定用户在应用程序中的进度？

我有以下容器：

我想做的是检测用户的URL

如果/welcome/step1设置步骤=1，如果/welcome/XXXX设置步骤=2，等等

使用React Redux，检测URL的正确方法是什么？然后我应该更新构造函数中的状态吗

欢迎光临

退房

要设置它，您需要一个根组件，其外观如下所示：

import React, { PropTypes } from 'react';
import { Provider } from 'react-redux';
import { Router, Route, browserHistory } from 'react-router';
import Welcome from './Welcome';

const Root = ({ store }) => (
  <Provider store={store}>
    <Router history={browserHistory}>
      <Route path="/welcome/(:filter)" component={Welcome} />
    </Router>
  </Provider>
);

Root.propTypes = {
  store: PropTypes.object.isRequired,
};

export default Root;

欢迎组件现在应该接收包含URL参数的params属性，例如step1或step2：

至于将其设置为状态。如果您只是想在render和showStep方法中使用它，那么将其设置为component state就可以了

---

有关将react router与Redux一起使用的更多详细信息。

谢谢，但欢迎组件没有获得props.params-我如何传递它？您如何渲染它？如果Welcome有一个不是路由器的父组件，则需要执行如下操作：const App={params}=>{return；}；它没有父对象。路由器是Welcometo的父级，我可能要包括这样的库才能访问参数？不，react路由器应该处理参数。

import React, { PropTypes } from 'react';
import { Provider } from 'react-redux';
import { Router, Route, browserHistory } from 'react-router';
import Welcome from './Welcome';

const Root = ({ store }) => (
  <Provider store={store}>
    <Router history={browserHistory}>
      <Route path="/welcome/(:filter)" component={Welcome} />
    </Router>
  </Provider>
);

Root.propTypes = {
  store: PropTypes.object.isRequired,
};

export default Root;

import React from 'react';
import { render } from 'react-dom'
import Root from './components/Root'
import configureStore from '../configureStore'

const store = configureStore()

render(
  <Root store={store} />,
  document.getElementById('root')
)

  constructor(props) {
    // props.params.filter == 'step1' || props.params.filter == 'step2'
    super(props);
    this.state = {
      // we're going to remove everything in the string 
      // that isnt numerical with regex
      // e.g., 'step1' -> '1',  'step234' -> '234'
      step: props.params.filter.replace( /^\D+/g, '')
    };
  }