Блог

Я новичок в React, и я наткнулся на react-dropdown-tree-select для конкретной возникшей у меня потребности, позволяющей пользователям просматривать данные в формате дерева для выбора в выпадающем списке. Но я хочу, чтобы пользователи выбирали только 1 значение за раз. Как я могу обеспечить это?

Непосредственно в react-dropdown-tree-select такого свойства доступно не было. Но вы можете прослушать onChange событие и сбросить все данные, которые вы передали в data реквизитах, с обновленными данными, выбрав только один узел.

Проверьте следующий код.

 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}
    />
  );
}
  

Это в основном остановит пользователя от выбора нескольких параметров, вместо отключения элемента remainig вы отменяете выбор ранее выбранных элементов.

Если вы хотите, чтобы одновременно выбирался только один элемент, вы можете использовать mode=»RadioSelect»