Реагировать, обновлять одно значение в состоянии, состоящем из массива объектов

NULL - это не что-то ... это неизвестно. NULL ничего не значит. Вот почему вы должны использовать магическую фразу IS NULL вместо = NULL в ваших SQL-запросах

Вы можете ссылаться на это: http://weblogs.sqlteam.com/markc/archive/2009 /06/08/60929.aspx

2
задан DavSev 4 March 2019 в 14:22
поделиться

4 ответа

В идеале вы должны использовать это

this.setState((prevState) => {
// Use prevState and do the map just like someone suggested in one of the answer
 courses: prevState.map(course => course.id === id ? {...course, courseGrade } : course)
})
0
ответ дан Subhendu Kundu 4 March 2019 в 14:22
поделиться

вы не можете изменить константные переменные,

const courses = [...this.state.courses];
    courses[index].courseGrade = courseGrade;
    this.setState({courses});

, если у вас есть значение и индекс ваших данных в массиве, просто сделайте это

let state = {...this.state}

state.courses[INDEX].courseGrade = courseGrade;

this.setState({...state})

я надеюсь, что это полезно

0
ответ дан Edison Junior 4 March 2019 в 14:22
поделиться

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

updateCourseGrade = (courseGrade, id) => {
  const course = this.state.courses.find(course => course.id === id);
  if (course) {
    const updatedCourse = { ...course, courseGrade };
    const updatedCourses = this.state.courses
      .filter(course => course.id !== id)
      .concat(updatedCourse);
    this.setState({ courses: updatedCourses });
  }
}

Это может быть довольно громоздким, но это является основой для философии самого React. Если вы хотите облегчить себе задачу, я рекомендую проверить immer , библиотеку NPM, которая экспортирует одну функцию. Обычно я не рекомендую сторонние библиотеки в качестве решения, но мне особенно нравится immer. Сначала это будет выглядеть странно, но работает с использованием прокси (новая языковая функция в ES6):

updateCourseGrade = (courseGrade, id) => {
  this.setState((
    produce(draftState => {
      const index = draftState.courses.findIndex(course => (
        id === course.id
      ));
      draftState.courses[index].courseGrade = courseGrade;
    })
  ))
}

Часто immer не нужен, но при работе с массивами объектов и особенно с вложенные объектные структуры могут быть удачной попыткой помочь вам написать чистый код, который хорошо работает.

0
ответ дан Robbie Milejczak 4 March 2019 в 14:22
поделиться

Когда вы работаете с состоянием React, вы работаете с неизменяемой структурой данных Immutable.js может быть спасителем.

Но мы также можем сделать это без зависимостей от карты и распространения объекта:

this.setState({
    courses: this.state.courses.map(course => course.id === id ? { ...course, courseGrade } : course)
})
0
ответ дан Rakha Kanz Kautsar 4 March 2019 в 14:22
поделиться
Другие вопросы по тегам:

Похожие вопросы: