反应 | Ant设计选择默认值

Question

我在我的项目中使用蚂蚁设计。

在这里，我有一个选择作为动态字段。 当我尝试为 select 设置默认值时。 它不起作用。

<Select defaultValue="lucy">
  <Option value="jack">Jack</Option>
  <Option value="lucy">Lucy</Option>
  <Option value="Yiminghe">yiminghe</Option>
</Select>

我将默认值设置为lucy但它不起作用

复制代码： https : //codesandbox.io/s/6x3qv6wymr

Answer 1

根据文档，您不应将value或defaultValue与getFieldDecorator 。

被getFieldDecorator包裹后，value（或valuePropName定义的其他属性）onChange（或trigger定义的其他属性）props会被添加到表单控件中，表单数据流将由Form处理，导致：

1. 您不应该使用 onChange 来收集数据，但您仍然可以监听 onChange（等等）事件。

2. 您不能通过 value defaultValue prop 设置表单控件的值，而应该使用 getFieldDecorator 中的 initialValue 设置默认值。

3. 您不应该手动调用 setState，请使用 this.props.form.setFieldsValue 以编程方式更改值。

因此，在您的代码中，您需要定义initialValue而不是defaultValue ，如下所示：

{getFieldDecorator(`names[${k}]`, {
        validateTrigger: ["onChange", "onBlur"],
        initialValue: "lucy",
        rules: [
          {
            required: true,
            whitespace: true,
            message: "Please input passenger's name or delete this field."
          }
        ]
      })(
        <Select>
          <Option value="jack">Jack</Option>
          <Option value="lucy">Lucy</Option>
          <Option value="Yiminghe">yiminghe</Option>
        </Select>
      )}

您可以在codeandbox.io上查看工作演示。

Answer 2

'getFieldDecorator' 中的问题，如果您将其删除，则一切正常。 所以在那里搜索 pb，React|A​​nt 没问题