Question

我现在对redux感到困惑，componentWillReceiveProps仍然相关吗？但我在console.log(this.props) componentWillReceiveProps我得到了空对象，但在渲染方法中做console(this.props)，结果却不一样。

说我有一个表单，它的值来自异步数据，我在哪里做setState？如果我这样做，表格不是受控制的组件。

Answer 1

componentWillReceiveProps传递下一个道具，所以请将它们记录下来this.props。它看起来像这样： componentWillReceiveProps(nextProps, nextContext)

更重要的是，如果您目前没有将react绑定到redux，那么您的组件中将无法对redux商店进行更改。你应该看看react-redux。这提供了一个connect函数，它具有mapStateToProps函数。 mapStateToProps将商店状态映射到组件（容器）的道具。

class MyComponent extends React.Component {
    componentWillReceiveProps(nextProps: any) {
        console.log('props current', this.props);
        console.log('props about to be', nextProps);
    }
    render() {
    // stuff here
    }
}
    const mapStateToProps = (state, ownProps) => {
        const { counter } = state;
        // if the props of MyComponent has a counter property
        return {
            counter
        }
    };

    export default connect(mapStateToProps, null)(MyComponent);

将组件连接到商店后，this.props将包含counter属性。

使用带有redux的componentWillReceiveProps

1 个答案: