Question

我尝试使用与路由器（简化）连接到Redux存储组件：

export class SomeComponent extends React.Component {
    // ... some methods goes here
    export default connect(
        state => ({
            someState: state.someState,
        }),
        dispatch => bindActionCreators({
            someAction,
        }, dispatch)
   )(SomeComponent);
}

某处，我需要使用react路由器连接组件：

const routes = (
    <Route path='/' component={Layout}>
       <Route path='/somepath' component={SomeComponent} />
    </Route>
);

export default class Verification extends React.Component {
    render() {
      const createElement = (Component, props) => {
        return (
          <Component />
        );
       };
       return (
           <div>
               <Provider store={store}>
                   <Router history={browserHistory} createElement={createElement}>
                      {routes}
                   </Router>
              </Provider>
           </div>
       );
  }
}

对于没有connect()的组件，它可以正常工作，但遗憾的是，由于Layout组件需要Children，但连接组件失败，但Children未定义。

是否可以以内联方式将组件传递给路由器？

Answer 1

问题只在于为Redux组件使用普通导入import A from './a';而不是import { A } from './a';。

如何使用Redux连接组件与反应路由器？

1 个答案: