Как правильно деструктурировать назначение с помощью динамического ключа c? (Реагируют / DESTRUCTURING-присваивания)

Question

Я только что получил ошибку eslint по поводу деструктурирования этого кода, но я понятия не имею, как он должен выглядеть. В этом случае я, вероятно, просто проигнорирую это предупреждение, поскольку этот код уже довольно лаконичен, но мне любопытно, как он будет деструктурирован. Любые идеи или рекомендации приветствуются.

  _onChange = (e, key) => {
    const edited = { ...this.state[key] }; <--- this line is throwing the eslint error
    edited[e.name] = e.value;
    this.setState({
      [key]: edited,
    });
  };

Answer 1

Итак, я смог добраться туда с комментариями.

В конце дня я понял, что мне просто нужно «отредактировать», чтобы быть объектом, содержащим деструктурированный объект.

 _onChange = (e, key) => {
    const { [key]: { ...edited } } = this.state;
    edited[e.name] = e.value;
    this.setState({
      [key]: edited,
    });
  };

Здесь edited станет {... this.state [ключ]}, который после сравнения выглядит так же, как и в предыдущем коде, но с использованием назначения деструктурирования.

Я надеюсь, что люди прокомментируют, если почувствуют, что это неправильно.

Еще проще, предложение Эмиль !

 _onChange = (e, key) => {
    const { [key]: current } = this.state;
    this.setState({
      [key]: { ...current, [e.name]: e.value },
    });
  };