Reactjs 尽管调用了action和reducer，但不会调用componentWillReceiveProps

这是调用相应操作的主文件-addPrescription，但当我访问理想情况下应包含所需数据的this.props.prescription时，我无法访问componentWillReceiveProps

import {connect} from 'react-redux';
import { addPrescription } from '../../actions/index';

class Prescription extends Component{
constructor(props) {
super(props);
this.state = {editorState: EditorState.createEmpty()};
this.onChange = (editorState) => this.setState({editorState});
}

createPrescription(prescription){
        this.props.addPrescription("pravandan");
        console.log(this.state.prescription);
}

componentWillReceiveProps(nextProps){
    console.log(nextProps.prescription)
}

render(){
    return(
            <div>
                <br/>
                <br/>
                <Row>
                    <Col span={12} push={6}>
                        <Button type="primary" onClick={() => this.createPrescription("")}>Submit</Button>
                        <br/>
                        <Button type="primary" onClick={() => this.createPrescription("")}>{this.props.prescription}</Button>
                    </Col>
                </Row>
            </div>
        );
}
}

const mapStateToProps = (state, ownProps) => {
return {
prescription : state.prescription
}
};

const mapDispatchToProps = (dispatch) => {
return {
addPrescription : prescription => dispatch(addPrescription(prescription))
}
};

export default connect(mapStateToProps, mapDispatchToProps)(Prescription);

从'react redux'导入{connect}；
从“../../actions/index”导入{addPrescription}；
类扩展组件{
建造师（道具）{
超级（道具）；
this.state={editorState:editorState.createEmpty（）}；
this.onChange=（editorState）=>this.setState（{editorState}）；
}
创建处方（处方）{
本.props.add处方（“pravandan”）；
console.log（this.state.prescription）；
}
组件将接收道具（下一步）{
console.log（nextrops.prescription）
}
render（）{
返回(




此.createPrescription（“”}>Submit


this.createPrescription（“”}>{this.props.prescription}
);
}
}
const mapStateToProps=（state，ownProps）=>{
返回{
处方：国家处方
}
};
const mapDispatchToProps=（调度）=>{
返回{
addPrescription:prescription=>dispatch（addPrescription（prescription））
}
};
导出默认连接（mapStateToProps、mapDispatchToProps）（处方）；

根据您发布的此减速机：

const addprescription = (state=[],action) => {
        console.log("reducers received")

    switch(action.type) {
        case 'ADD_PRESCRIPTION' :
            return [
                ...state,
                {
                    prescription : action.prescription
                }
            ]

        default : 
            return state;
    }
}

export default addprescription;

您的减速器名为

addprescription

。在

MapStateTrops

中，您需要

改变

处方：状态。处方

到

prescription:state.addprescription

或者最好给你的减速机重新命名。当前，

状态。处方

不存在<代码>状态。addprescription[0]。prescription是减速器执行操作后将存在的状态，但由于减速器名称的原因，您仍然无法将此状态映射到道具

编辑：查看代码沙盒后

我看到您将

state.addprescription[0]。prescription

添加到

MapStateTrops

中。问题是，您的初始状态是一个空数组，因此我可以看到它是如何抛出错误的

const mapStateToProps = (state, ownProps) => {
    return {
        prescription : state.addprescription[0].prescription
    }
    console.log(state.prescription)
};

更改

状态。添加处方[0]。处方

为

状态。添加处方

现在，您正在将对象添加到

addprescription

数组中。因此，您要添加到减速器中这些对象的

prescription

键现在可以在

this.props.prescription[index].prescription

上使用。您可能想重新考虑您的命名约定

---

这里是一个赤裸裸的骨头。应该很容易从上到下进行操作。

您所说的“无法访问

组件将接收道具”是什么意思？React不调用componentWillReceiveProps（），在安装过程中使用初始道具。您可以阅读。@KyleRichardson是的，但我的意思是该函数应该在操作启动后调用，但我可以看到您的减速机吗？@KyleRichardson是的，当然可以-谢谢。。但是我得到了这个错误TypeError:无法读取未定义的属性“0”。您是否可以对您的减缩器、组件和动作创建者进行修改。调试一个完整的模块要容易得多。这是我做的。我现在就去看看你的。看一看，也许在我看完你的之前能帮你：）非常感谢你，但我仍然无法找出我的错误。你能帮忙吗