使用“.map”获取选项时如何修复选择的默认值？

Question

我有一个<select> 标签。此标记的选项包含在一个数组中。这个数组的值是我想向用户显示的字段，索引是我想提供给我的“onChange”函数的值。到现在为止还挺好。 但是，当我打开包含<select> 的弹出窗口时，默认值不是我设置的值。

我尝试过设置defaultValue、value，当然我也检查了我想要的默认值。

这是我的意思的一个示例：

options = ["string1", "string2", "string3", ...];
valueIWant = options[indexGivenToFunction];

(...)

<select name="content" defaultValue={valueIWant} onChange={this.changeContent}>
    { options.map((opt, index) => {
        return (
            <option value={ index } key={ opt }>{ opt }</option>
        );
    })}
</select>

我希望打开弹出窗口时的默认值是我在此处设置的值。 但是，它似乎设置为我的数组的第一个值。

我做出的一个（非常）疯狂的猜测是，因为 select 不允许除它提供的字段之外的任何其他字段，并且因为当我设置 defaultValue options.map 时尚未解决，它忽略了该值我给出了它，而是将第一个选项作为该字段的条目（正如我所说，只是一个猜测）。我对吗？有没有办法绕过这种行为来设置一个 defaultValue？

感谢您的帮助。

Answer 1

在 map 之前使用 * 标记的行。

您的默认值* { options.map((opt, index) => { 返回 （ {选择}