Как при событии передать в параметре какой стейт нужно менять?

Question

[uRoot]

Есть чекбоксы фильтров:

const buttons = this.buttons.map (({ name, title }) => {
      return (
        <label key={name}>
          {title}
          <input
            name={name}
            type="checkbox"
            onClick={ (event) => { this.props.filterItems(name, event)} }
          />
        </label>
      )

Есть стейт:

state = {
    new : false,
    action : false
  };

Я пытаюсь установить стейт так:

filterItems = (name, event) => {
    this.setState({
      [name]: !this.state.checked
    });
    // ...
  };

Но стейт меняется только 1 раз. Подскажите, что я делаю не так. Я хочу в функции передавать параметр, в this.setState его вытягивать и записывать одной строкой: поле_стейта_который_я_передал: !this.state.checked. Если этот подход не правильный - покажите как правильно.

Answer 1

[0xD34F]

onChange={this.props.filterItems}

filterItems = ({ target: { name, checked } }) => {
  this.setState({
    [name]: checked,
  });
}

Comments

[uRoot]

У меня ещё один вопрос...

Код:

filterItems = ({ target: { name, checked } }) => {
    this.setState({
      [name]: checked,
    });
    console.log( this.state.new )
  }

Консоль не успевает за стейтом, отображая её не обновлённое значение. Как правильно будет дождаться обновления?

[0xD34F]

CryNet, https://ru.reactjs.org/docs/react-component.html?#...

[uRoot]

0xD34F, не успел удалить второй вопрос... Просто консоль не успевает отрисовывать, если что-то выводить на экран, то всё ок. Спасибо за ссылку.