antd:无法动态地增加表单项

时间:2018-09-03 02:05:33

标签: reactjs antd

getFieldDecorator("keys", { initialValue: [1] });
const keys = getFieldValue("keys");
const formItems = keys.map((k, index) => {
  return (
    <FormItem
      {...(index === 0 ? formItemLayout : formItemLayoutWithOutLabel)}
      label={index === 0 ? "Passengers" : ""}
      required={false}
      key={k}
    >
      {getFieldDecorator(`names[${k}]`, {
        validateTrigger: ["onChange", "onBlur"],
        valuePropsName: "value",
        rules: [
          {
            required: true,
            whitespace: true,
            message: "Please input passenger's name or delete this field."
          }
        ]
      })(
        <Input
          placeholder="passenger name"
          style={{ width: "60%", marginRight: 8 }}
        />
      )}
      {keys.length > 1 ? (
        <Icon
          className="dynamic-delete-button"
          type="minus-circle-o"
          disabled={keys.length === 1}
          onClick={() => this.remove(k)}
        />
      ) : null}
    </FormItem>
  );
});

在antd的官方示例中,动态添加表单项不会获得表单值。为什么?我找不到问题。您有使用过antd的朋友吗?

0 个答案:

没有答案