reactjs - React-router withRouter 不提供 mapStateToProps 中的 props?

标签 reactjs react-router

我目前面临一个奇怪的问题,即 react-router 提供的 HOC withRouter 不会将 props 传递给 mapStateToProps 函数。我这里做错了吗?

import React, { Component } from 'react';
import { Link, withRouter } from 'react-router';
import { connect } from 'react-redux';


class ThisClass extends Component {
    render() {
        console.log(this.props.router); // Returns object with router keys (params, router, go, routes, ...)
        // Render stuff
    }
}

const mapStateToProps = (state, props) => {
    console.log(state); // returns state of redux
    console.log(props); // returns empty object -> {}, how come this is empty?!

    return {
        consultations: patientThisClassSelector(state, props)
    };
}

export default connect(mapStateToProps)(withRouter(ThisClass));

最佳答案

在连接组件之前,您必须先注入(inject) router props。

要实现这一点,您必须使用

export default withRouter(connect(mapStateToProps)(ThisClass));

而不是

导出默认连接(mapStateToProps)(withRouter(ThisClass));

关于reactjs - React-router withRouter 不提供 mapStateToProps 中的 props?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/43157927/

相关文章:

reactjs - react 传单 : setting a polygon's style dynamically

reactjs - react 路由器中组件的不同导航栏

javascript - React-Router 1.0.0RC1 - 将状态作为属性传递给子路由

reactjs - 使用 Electronjs/SerialPort 和 React/Redux 的数组绑定(bind)

javascript - 这是使用 redux 删除项目的正确方法吗?

reactjs - 如何减少我的 reactjs/JSX 中的标记量

javascript - 如何使用 Reactjs 中的按钮重定向到另一个页面

javascript - React Router 中 useHistory 和 useLocation 是 let 还是 const ?

reactjs - React Routing 导致输入失去焦点

reactjs - 如何从三层以下的子组件中调度操作?