使用setFieldsValue时如何在Ant Design Select中显示选项名称

Question

我正在使用Ant Design中的组件，最近我添加了一个按钮来选择所有选项。该功能还可以，但是在该字段中显示的是选项键或ID，而不是显示选项名称。

我的问题是，在多选组件中使用setFieldsValue方法时，有什么方法可以显示选项名称？

我已尝试在此部分selecteds.push(kid.id);中推送具有不同属性（ID，名称，键，值，标题等）的对象，但这些都不起作用。

我的选择功能看起来像这样

selectAllKids = () => {
    const { kids } = this.props;
    let selecteds = [];

    kids.map(kid => {
      selecteds.push(kid.id);
    });

    this.props.form.setFieldsValue({
      kids: selecteds
    });
  };

和我的组件：

         {getFieldDecorator("kids", {
          rules: [
            {
              required: true,
              message: "Selecciona alumnos"
            }
          ]
        })(
          <Select
            size="large"
            mode="multiple"
            placeholder="Selecciona alumnos"
            loading={kidsLoading}
          >
            {kids.map(kid => (
              <Option key={kid.id}>{kid.name}</Option>
            ))}
          </Select>
        )}

我当前的结果是：我的预期结果是：预先感谢！

Answer 1

您应该映射到name而不是id：

this.props.form.setFieldsValue({
  kids: kids.map(({ name }) => name)
});