Question

selector标记中的defaultValue属性无法按预期工作。我有一个表单组件，其中包含一些字段和一些选择器字段。现在，当从另一个组件中按下编辑按钮时，我需要预填充表单。我通过this.props.history.push({ pathname: "/Register", prePopulate: res.data.data });

传递了数据

然后我使用this.props.location.prePopulate访问数据。

我将新值设置为状态，并且表单字段随以前的数据一起加载。问题在于选择器不显示先前选择的选项。我尝试使用defaultvalue属性并传递this.state.value值，但它不起作用。如果我对某个选项进行了硬编码，则它可以工作，但是当它尝试从状态中拉出时却无效。

<select
                        className={classnames("form-control form-control-sm", {
                          "is-invalid": this.state.valEmergency
                        })}
                        name="emergency"
                        onChange={this.onChange}
                        defaultValue={this.state.emergency}
                      >
                        <option value="">Choose your level</option>
                        <option value="PRIMARY">Primary</option>
                        <option value="SECONDARY">Secondary</option>
                        <option value="TERTIARY">Tertiary</option>
                      </select>

Answer 1

您可以只使用value属性，并使用onChange={this.onChange}处理更改。因此，不用defaultValue={this.state.emergecy}来代替value={this.state.emergency}

带有默认值问题（JSX）的选择器标签

1 个答案: