反應onChange功能不適用於選擇標簽

Question

我已經有一段時間了，所以我希望在這里找到答案。 我試圖根據react docs中提供的代碼實現一個簡單的select標簽。 但是，這對我不起作用。 這是我編寫的代碼：

<select value={this.state.formId} onChange={this.handleInternalFormChange}>
                        {
                            Object.keys(this.state.userForms).map(formKey => ( 
                                <option key={formKey} value={formKey} > {this.state.userForms[formKey]} </option>
                            ))
                        }

這是調用onChange的函數，

 handleInternalFormChange = (e) =>{
        this.setState({
            formId: e.target.value
        })
        console.log(this.state.formId);

    }

進行這些更改后，onChange函數似乎不起作用。 我試圖打印出被調用的事件，但似乎沒有包含target 。 不知道該怎么辦，有人可以幫忙嗎？

Answer 1

您目前的操作方式沒有任何問題。 您的console.log()不輸出狀態的原因是因為setState()是異步的（順便說一句， console.log()也是異步的）。 如果您想查看更新后的狀態是什么，請使用setState()的第二個參數，該參數為您提供新值。

您可以通過以下方式替換函數調用來確認onChnage()正在使用該事件：

<select onChange={e=>console.log(e.target.value)}>

如果要在狀態更新后檢查該值，請執行以下操作：

this.setState({value}, updatedState=>console.log(updatedState));

希望可以幫助清理問題，

Answer 2

如果要獲取console.log結果，請檢查此

 handleInternalFormChange = (e) =>{
        this.setState({
            formId: e.target.value
        }, () => {
           console.log(this.state.formId);
        })

    }