如何在react-dropdown-tree-select中禁用多值选择的复选框？

Question

我是React的新手，我偶然发现了react- DropDown - Tree -select，以满足我的特定需求，允许用户以树格式查看数据，以便在DropDown中进行选择。但是，我希望用户一次只选择一个值。我怎么才能强制执行呢？

Answer 1

在react-dropdown-tree-select中没有直接可用的属性。但您可以侦听onChange事件，并在仅选择一个节点的情况下，使用更新后的数据重置您在data props中传递的整个数据。

检查以下代码。

onChange = (currentNode) => {
  // keep reference of default data structure.
  const updatedData = this.props.defaultData;
  // find node related to currentData in your tree and set checked property
  this.setState({data : updatedData });  
}

render = () => {
 return (
    <DropdownTreeSelect
      data={this.state.data}
      onChange={this.onChange}
    />
  );
}

这将从根本上阻止用户选择多个选项，而不是禁用剩余项您正在取消选择以前选择的项。