Как установить состояние состояния компонентаact-select, когда isMulti = {true}? - PullRequest
Новая
       34

Как установить состояние состояния компонентаact-select, когда isMulti = {true}?

0 голосов
/ 19 апреля 2020

Вот часть моего кода:

Таблица, которую я использую: 

const options = [
  { value: 'Orange', label: 'Orange' },
  { value: 'Banana', label: 'Banana' },
  { value: 'Apple', label: 'Apple' },
];

Я создаю состояние "value", которое представляет собой таблицу с начальным состоянием пустой таблицы: value: [ ]. 

 private handleChange(value: any) {
    this.setState({ value: value });
  }

<Select
          value={this.props.selection}
          onChange={() => this.handleChange.bind(this)}
          options={options}
          isClearable={true}
          isMulti={true}
        />

{this.props.selection} является типом следующего класса: 

export class Selection {
  value: string;
  label: string;

  constructor(
    value: string,
    label: string,
  ) {
    this.value = value;
    this.label = label;
  }
}

Когда я выбираю опции из компонента Выбрать, состояние «значение» не изменение. Ты хоть представляешь, что я делаю не так?

1 Ответ

0 голосов
/ 19 апреля 2020

Обратный вызов, который вы назначаете для onChange={() => this.handleChange.bind(this)}, фактически ничего не делает каждый раз, когда вы изменяете значение в своем выборе. Единственное, что он делает, это привязывает this к handleChange. Это не будет вызывать функцию.

Достаточно передать результат связывания, который уже является функцией.

onChange={this.handleChange.bind(this)}

Подумайте об этом 

function sum(a,b){
   return a+b;
}

const sumWithNoArgs = () => sum.bind(null, 1,2);

Если мы теперь вызовем sumWithNoArgs (), мы получим новую функцию вместо суммы. Это именно то, что делает select, он вызывает функцию, которую вы передаете.

Вы должны сделать 

const sumWithNoArgs = () => sum.bind(null, 1,2)();

, поэтому мы вызываем SumWithNoArgs (), чтобы получить результат с пропуском.

Вам необходимо либо связать вашу функцию в конструкторе, либо объявить функцию как переменную класса, чтобы она автоматически привязывалась к вашему классу.

...