Question

我正在使用ReactJs和Ant Design创建一个问卷类型表格。这是How to create a questionnaire type form using Ant Design?

的后续问题

现在，我成功添加了新问题及其相应的答案，但未删除它们。假设我添加了三个问题，并且当我尝试删除其中任何一个时，它总是删除最后一个。删除相关代码如下：

remove = k => {
    console.log(k);
    const { form } = this.props;
    // can use data-binding to get
    const keys = form.getFieldValue("keys");
    // We need at least one passenger
    if (keys.length === 1) {
      return;
    }
    keys.splice(k, 1);
    // can use data-binding to set
    form.setFieldsValue({
      keys: keys
    });
    console.log(keys);
  };

完整代码可以在demo on codesandbox.io中找到。

Answer 1

我过去做过类似的事情。摆脱了antd remove的样板，并以此替换。每次添加一行时，我都会将该行（对象）推入formRows数组，然后像这样删除：

  remove = key => {
    const newRows = this.state.formRows.filter(r => r.key !== key)
    this.setState(
      prev => ({
        formRows: newRows
      })
    )
  }

如何使用索引（特定于Ant设计）从数组中删除值？

1 个答案: