Question

ReactJs

当我使用e.target.value时，我的下拉列表会更新，但当我使用e.target.options[e.target.selectedIndex].text时，我的下拉列表不会更新，但文本实际上已设置为声明的状态。可能是什么问题呢？我需要帮助。

在我的onChange上，我有：

handleChange(e) {
        const { name, value, selectedIndex, options} = e.target

        if (name == "fundingInstitutionName") {
            this.setState({
                fundingInstitutionName: options[selectedIndex].text,
                bank_code: value
            }, () => {
                this.validateAccountNum();
            })
        } else {
            this.setState({
                [name]: value
            }, () => {
                this.validateAccountNum();
            })
        }

    }

虽然我在选择下拉列表中有这个，

<select 
     className="form-control kyc-input"
     value={this.props.state["fundingInstitutionName"]}
     onChange={(e) => this.props.handleChange(e)}
     name="fundingInstitutionName" required>

     <option value="">Select bank</option>
        {bNames.map((bName, i) => {
            return <option key={i} value={bName.code}>
                        {bName.name}
                    </option>
         })}

</select>

注意：我需要值和文本，因为它们是分开的。

Answer 1

您正在设置this.props.state["fundingInstitutionName"]中的选择值。

我认为你打算从中设置它 this.state["fundingInstitutionName"]。

还有一件事：在handleChange中你应该设置状态变量来设置select的值，但有时你会这样做：

this.setState({
  [name]: value
}

这不会反映在选择的值...

中

选择Reactjs时，下拉列表显示为空

1 个答案: