Прохождение события в response-select

Согласно документам в response-select (https://github.com/JedWatson/react-select), есть свойство, которое принимает функцию с двумя параметрами (значение, событие). Мне нужно было получить событие. Я здесь что-то не так делаю?

Код: https://codesandbox.io/s/62wrx9pm1k


react-select
person Azad Rahman    schedule 15.05.2018    source источник
comment
Что именно вы хотите от мероприятия   -  person Rajat Dhoot    schedule 15.05.2018
comment
вместо того, чтобы писать обработчики каждый раз, когда я использую ‹Select›, я хотел бы использовать одну функцию, например: handleChange(event) { this.setState({[event.target.name]: event.target.value}) }   -  person Azad Rahman    schedule 15.05.2018
comment
там нет необходимости в событии, вы можете проверить первый пример на официальном сайте. Вы можете использовать this.handleChange для своего варианта использования.   -  person Rajat Dhoot    schedule 15.05.2018
comment
Можете ли вы предоставить рабочий пример того, как два компонента Select используют один и тот же обработчик onChange?   -  person Azad Rahman    schedule 15.05.2018

Ответы (2)


arrow_upward
1
arrow_downward

нужно состояние эквалайзера

class App extends Component {
  state = {
    firstValue: "",
    secondValue: ""
  };
  handleChange = (value, state) => {
    this.setState({ [state]: value });
  };
  render() {
    return (
      <Select
        name="form-field-name"
        value={this.state.value}
        onChange={(value) => this.handleChange(value, "firstValue")}
        options={[
          { value: "one", label: "One" },
          { value: "two", label: "Two" }
        ]}
      />
      <Select
        name="form-field-name"
        value={this.state.value}
        onChange={(value) => this.handleChange(value, "secondValue")}
        options={[
          { value: "one", label: "One" },
          { value: "two", label: "Two" }
        ]}
      />
    );
  }
}
person yurii kosygin    schedule 15.05.2018
comment
- для этого мое имя состояния должно иметь значение - когда у меня есть два компонента Select, что мне делать? Это не служит никакой цели. - person Azad Rahman; 15.05.2018
comment
state = {firstChild: '', secondChild: ''} и onChange = {(value) = ›handleChange (value, 'secondChild')}, например, и handleChange = (values, state) =› this.setState ({ [состояние]: значение}) - person yurii kosygin; 16.05.2018
comment
Спасибо за помощь. Это сработало с небольшой настройкой. Вот рабочая демонстрация, если вам интересно: codeandbox.io/s/9q24z49zvr - person Azad Rahman; 17.05.2018

arrow_upward
0
arrow_downward

В версии 2.0.11 и выше, чтобы обновить свое состояние для каждого Select с той же функцией, вы можете сделать это следующим образом:

class MyComponent extends Component{
 state={
  firstSelect: null,
  secondSelect: null
 }
 handleSelectChange = (selectedOption, { name }) => {
   this.setState({ [name]: selectedOption.value });
 }
 render() {
      return (
          <>
           <Select name="firstSelect" onChange={this.handleSelectChange} {...}/>
           <Select name="secondSelect" onChange={this.handleSelectChange} {...}/>
          </>
      )
 }
}
person Niraj    schedule 11.08.2020