删除FormItem中的“自动完成”选项后，如何清除带有已删除值的输入？

Question

• 环境： Windows7 / Chrome68.0.3440.84 / React ^ 16.2.0

• ant-design版本：3.8.0

• 最小复制链接： https://codepen.io/evanna51/pen/KBGEXb

• 正在发生： 删除一个选项后，该值仍取决于输入。

• 复制步骤：

  1. 单击删除

  2. 已删除name1。

  3. 列表不再具有name1，但仍在输入中

我已删除状态为result.splice(key, 1);，

的选项

，甚至使用antD的形式方法setFieldsValue，例如：this.props.form.setFieldsValue({name: ""});

删除后如何清除输入内容？

Answer 1

我认为使用AntDesign的基本自动完成功能是不可能的，您需要使用Lookup-Patterns - Certain Category方法。

您可以首先将<OptGroup />定义为：

const OptGroup = AutoComplete.OptGroup;

然后您可以使用<OptGroup />来安装<Option />上，如下所示：

const children = result.map((value, index) => {
  return (<OptGroup 
            key={index} 
            label={<Icon 
                     style={{'margin-top':'40px','float':'right','cursor':'pointer'}} 
                     type="close" 
                     onClick={this.deleteOption.bind(this, index)} />}>
            <Option key={index} value={value}>{value}</Option>
          </OptGroup>);
    });

我更新了live demo in CodePen。