Question

在this example from the docs of redux-forms中，reset作为父组件的道具收到。点击清除值按钮后，系统会调用reset，这会将下拉选项重置为默认值。

reset函数中可能包含哪些内容？换句话说，如何以编程方式访问<option>元素并更改其值？

Answer 1

当您使用reset装饰时，reduxForm({...})可用作该表单的道具，如文档中所示。也就是说，您不必编写自己的reset()并将其作为支柱传递给表单组件。

Answer 2

换句话说，如何以编程方式访问<option> 元素并改变其价值？

它不......反应不起作用。

考虑

class Select extends React.Component {
  state = { selectedValue, options: [] }

  render() {
    return (
      <select>
        { this.state.options.map(mOption => {
          return 
          (
            <option 
              value={mOption.value}
              selected={selectedValue === mOption.value}
            >
              { option.label }
            </option>
          )
        }) }
      </select>
    )
  }
}

有点select组件的天真（和部分）实现。在这种情况下，reset方法只会重置组件的state，并且react会根据新状态解析DOM。 Redux只是一个全局状态存储 - 除了将状态映射到道具之外，一切都或多或少相同。

重置下拉列表React中的过滤器

2 个答案: