javascript - setState 带有 <select> 选项，并将值作为对象

Question

我有一个渲染选择元素的组件，如下所示:

<select 
    name="directoryAttributes"
    id="dirSelect"
    className="form-control"
    onChange={this._handleChange}>
    {
        attributes.map(attribute => {
            return (
                <option
                    value={attribute}
                    key={attribute.directoryAttributesNo}
                >{attribute.label}</option>
            );
        })
    }
</select>

attribute 是一个带有一些键/值的普通对象。我想调用 handleChange 将组件状态设置为该选项值(即属性对象)。这是我的handleChange

_handleChange(e) {
    e.preventDefault();
    const element = e.target;
    const stateObject = {};

    stateObject[element.name] = element.value;
    this.setState(stateObject);
}

问题是，它似乎将 directoryAttributes 的状态设置为 [object Object]。为什么会发生这种情况，是 react 的怪癖还是我缺少的东西？

提前致谢!

编辑:对象的属性数组来自状态，只是为了澄清

Answer 1

问题是您无法将对象设置为您选择的选项的值。该值将设置为字符串值 [object Object]。

您可以做的是根据 ID 查找您的属性。