javascript - react this.setState 未更新状态

Question

我试图找出为什么调用 this.setState 没有更新状态。

我有以下几行方法:

changeState(state, value){
        this.setState({state:value}, ()=>console.log(this.state));
    }

有几个函数使用此组件，但其中一个是文件上传组件。它是一个简单的组件，可以呈现文件输入，也可以呈现 iframe、禁用输入和按钮。单击按钮时，我想更改父组件中的状态，然后重新呈现文件组件并显示文件选择器。

对 this.setState 的调用似乎工作正常，但是当我在运行后控制台日志状态时或者如果我在下一次渲染发生之前停止执行，状态不受影响。我的文件上传组件有一个这样的方法:

renderField(field){
        if(this.props.hasOwnProperty('file') && this.props.file){
            return(
                <div>
                    <iframe src={this.props.file} frameborder="0"> </iframe>
                    <input
                        disabled
                        placeholder={this.props.file}
                        name={field.name}
                        type='text'
                    />
                    <span onClick={()=>this.props.changeFile(this.props.file_type, null)}>&times; Remove</span>
                </div>
            )
        }else{
            return(
                <input
                    {...field}
                    type={field.type}
                    name={field.name}
                    onChange={(event) =>{
                        field.input.onChange(field.input.value = event.target.files[0])}
                    }
                />
            )
        }
    }

当我调用该方法时，我得到以下输出:

但是在控制台记录之后我的状态并没有改变:

Answer 1

您不想设置状态中的 state 属性，而是设置 state 包含的属性名称。

您可以使用 computed property name为此。

changeState(state, value) {
  this.setState({ [state]: value }, () => console.log(this.state));
}