首页 > 解决方案 > 在 react.js 中选择选项的值字段中设置 id

问题描述

tblGender在数据库中有一个包含 3 个字段的表fldIDfldName并且isActive。表有一个引用oftblEmployee的外键。现在我从数据库中获取一个性别列表并将其设置如下:fldIDtblGender

获取数据:

fetch('api/Employee/GetGenders')
            .then(response => response.json() as Promise<Array<any>>)
            .then(data => {
                this.setState({ genderList: data });
            });

填充下拉列表:

<select className="form-control" data-val="true" name="FldGender" defaultValue={this.state.empData.FldGender} onChange={e => this.state.empData.FldGender = e.target.value} required>
                            <option value="">-- Select Gender --</option>
                            {this.state.genderList.map(gender =>
                                <option key={gender.fldID} value={gender.fldID}>{gender.fldName}</option>
                            )}
                        </select>

但未gender.fldID在值中设置。现在,如果我尝试设置gender.fldName它已成功设置。但我想gender.fldID在下拉列表更改时获取。如何在'事件中设置fldID而不是设置?fldNamethis.state.empData.FldGenderonChange

标签: javascriptjsonreactjsonchange

解决方案


看起来你有一个错字。您的 genderList 数据有fldId,但在您的代码中您已将其提及为fldID. 请更改您的选项如下

<option key={gender.fldId} value={gender.fldId}>{gender.fldName}</option>

推荐阅读