我们有一个工作流程中的用户表,其中每个用户根据他们在工作流程中所处的步骤而具有不同的状态。为便于示例,假设从 1-4 有 4 个步骤。
每个用户在他们的表格行上都有一个按钮,单击该按钮会打开一个模式,该模式会获取他们的用户 ID 和当前步骤作为数据值。
handleClick = (event) => {
let step = event.target.dataset.step;
let id = event.target.dataset.id;
this.setState({ currentStep: step, userId: id, moveUserModal: true });
}
.........
<Modal
isOpen={this.state.moveUserModal}
>
<UserModal step={this.state.currentStep} userId={this.state.userId} close={this.close} />
</Modal>
在模态中:
constructor(props) {
super(props);
console.log(this.props);
}
控制台日志为两个变量返回 undefined,为关闭返回 f()。如果 moveUserModal 为真,是否有其他变量不具有构造函数可以访问的值的原因?
最佳答案
没有什么能阻止您的 UserModal 从一开始就进行 mouting。
当你的父组件正在挂载时,你的 UserModal 也在挂载,并且已经调用了未定义的构造函数。
也许可以试试:
<Modal isOpen={this.state.moveUserModal} >
this.state.moveUserModal && <UserModal step={this.state.currentStep} userId={this.state.userId} close={this.close} />
</Modal>
关于javascript - 变量不会同时从 React setState 改变,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/51969682/