Блог

Главная - Вопросы по программированию - Как я могу перебирать похожие объекты по состоянию и помещать их в object?

Как я могу перебирать похожие объекты по состоянию и помещать их в object?

#javascript #reactjs

#javascript #reactjs

Вопрос:

У меня есть несколько переменных в моем this.state объекте:

 this.state = {
      draw_number: '',
      user_number_1: '',
      user_number_2: '',
      user_number_3: '',
      user_number_4: '',
      user_number_5: '',
      user_number_6: '',
    }

Как я могу перебирать их и добавлять в следующий объект: 

 results {
  numbers: [],
  draws: x
}

Это мое текущее решение:

  this.state = {
      draw_number: '',
      user_number_1: '',
      user_number_2: '',
      user_number_3: '',
      user_number_4: '',
      user_number_5: '',
      user_number_6: '',
    }
  }

  submitHandler = () => {
    let results = {};
    for (let i=1; i<=6; i  ) {
      results = this.state['user_number_'   i];
    }
    console.log(results);
  }

Прямо сейчас я не могу выполнить консоль.зарегистрируйте мой объект «результаты»

Комментарии:

1. Можете ли вы более конкретно сформулировать свой вопрос? Чем это должно отличаться от вашего собственного решения?

2. Я хочу перебрать значения моего состояния и добавить их к results объекту, который позже будет передан через AJAX-вызов на сервер

3. Ваша проблема в том, что вы каждый раз перезаписываете результаты в своем цикле вместо добавления / push / add / etc…

4. Одним из решений является создание объекта со свойствами number let numbers = { number_1: '', etc.. } и при сохранении, используя Object.keys, вы можете помещать их в массив.

Ответ №1:

Вы могли бы извлечь draw_number свойство из состояния и использовать его как draws , а затем использовать Object.keys для остальных свойств в вашем состоянии и использовать эти значения в качестве numbers массива.

 submitHandler = () => {
  let { draw_number: draws, ...rest } = this.state;
  let results = {
    numbers: Object.keys(rest).map(key => rest[key])
    draws,
  };
  console.log(results);
}

Ответ №2:

Вы можете использовать [оператор распространения][https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Spread_syntax ]. Таким образом, вы можете скопировать все ключи из object (новое в ECMAScript 2018):

 const myFriend = {name: 'George', age: 12}
const mySuperFriend = { ...myFriend, superpowers: true }

ПРИМЕЧАНИЕ
вы не должны изменять объект состояния непосредственно в react.
Вместо этого создайте новый объект и setState его