Question

我有下面的JSON，我想遍历该对象并将其作为下拉选择列表引导程序中的选项获取：

location = {
"1": "1234 E. Big Beaver Rd. Troy WI",
"2": "7340 Shoal Blvd.,Austin CA",
"3": "58 Executive Park, Irvine CA 92456",
"4": "710 rue de la Renaissance Pittsburg"
}

我正在使用引导选择，ReactJS和ExpressJS。我想使用上面的对象创建一个选择字段。我不知道为什么它不能以某种形式工作。我有一个具有类似JSON的类似选择字段，并且可以正常工作。

下面是我的代码：

<div className="row">
<div className="form-group col-md-4">
<label>location:</label>
<select
value={this.state.location}
onChange={this.handleChangeLocation}
style={{ fontSize: 14, width: '750px' }}
className="form-control">
{ Object.entries(this.state.location).map(elem => {
console.log('elem: ' + elem);
    return ( <option value = {elem[1]}>{elem[1]}</option> );
                    })
               }
</select>
</div>
</div>

我需要在渲染中进行哪些修改才能同时使用bootstrap-select和ReactJS？

Answer 1

使用"Row 3"而不是Object.prototype.keys遍历属性。同样不要忘记在每个选项上添加Object.prototype.entries prop，这样React就会知道需要重新渲染什么：

key

循环选择对象的对象时，bootstrap-select失败

1 个答案: