首页 > 解决方案 > React Router V4 - 道具没有从父组件传递给 this.props.children

问题描述

使用 react-router v4 时,React.cloneElement 不会将道具传递给子组件。我正在获取历史和位置道具。只是没有从 mapStateToProps 获得任何动作或道具。

使用 react-router v3 时工作正常......仅当我更新版本时,道具没有被传递。


class Main extends React.Component{
  render(){
    var clonedElements = React.cloneElement(this.props.children, this.props);
    return(
      <div>
        <h1>
          <Link className='headLine'  to='/'><img src='https://i.imgur.com/DFkO2gb.png'/></Link>
          <p className='disclosure'>....</p>
        </h1>
          {clonedElements}
      </div>
    )
  }
}


const router = (
    <Provider store={store}>
        <Router history={history}>
            <App>
         <Switch>
              <Route exact render={props => <CardsGrid {...props} /> }></Route>
              <Route exact path='/view/:postId' component={Single}></Route>
         </Switch>
            </App>
        </Router>
    </Provider>
) 


function mapStateToProps(state){
    return {
        posts: state.posts,
        comments: state.comments
    }
}

function mapDispatchToProps(dispatch){
    return bindActionCreators(actionCreators, dispatch);
}

const App = withRouter(connect(mapStateToProps, mapDispatchToProps)(Main));

export default App;

我期待看到初始状态设置的 2 个道具作为道具。我现在没有看到这些。

标签: javascriptreactjsreact-reduxreact-router

解决方案


推荐阅读