Javascript 使用componentWillReceiveProps和redux
我现在对redux感到困惑,Javascript 使用componentWillReceiveProps和redux,javascript,reactjs,redux,Javascript,Reactjs,Redux,我现在对redux感到困惑,组件是否会收到相关的道具?但是我console.log(this.props)在componentWillReceiveProps中得到了空对象,但是在render方法中执行console(this.props)时,结果不一样 说我有一个表单,它的值来自异步数据,我在那里做setState?如果我这样做,则表单不是受控组件。组件将接收道具传递下一个道具,因此,注销这些道具,而不是this.props。看起来是这样的: 组件将接收道具(nextrops,nextCont
组件是否会收到相关的道具?但是我console.log(this.props)
在componentWillReceiveProps
中得到了空对象,但是在render方法中执行console(this.props)
时,结果不一样
说我有一个表单,它的值来自异步数据,我在那里做setState?如果我这样做,则表单不是受控组件。组件将接收道具
传递下一个道具,因此,注销这些道具,而不是this.props
。看起来是这样的:
组件将接收道具(nextrops,nextContext)
更重要的是,如果您目前没有将react
绑定到redux
,那么对redux
存储的更改在您的组件中将不可用。你应该看看。这提供了一个connect
功能,该功能采用mapstatetops
功能MapStateTrops
将存储状态映射到组件(容器)的道具
一旦您将组件连接到存储,那么this.props
将包含counter
属性。检查,this.props
内部组件将接收props
将具有旧的props值而不是新的,新的props值将在该方法的第一个参数中可用。非常好的解释
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);