Мне нужно найти элемент в объекте у которого есть определенное свойство , я это уже сделал вот таким кодом - result = this.state.tasksArray.findIndex(item => item.id === id);
, все бы ничего , но теперь мне нужно создать идентичную копию объекта из state и присвоить ей свойство из найденного элемента . Примерно так -
let result = this.state.tasksArray.findIndex(item => item.id === id);
let tasksArray = Object.assign({}, this.state.tasksArray);
tasksArray.result.crossout = true;
this.setState({ tasksArray: tasksArray });
Как то так постарался реализовать, но компилятор не видит result .
Как можно реализовать данную идею, что бы потом state присвоить объект с одним измененным свойством которое мы нашли через id, надеюсь понятно объяснил
Метод findIndex()
возвращает индекс в массиве - это Number
, то есть число. Чтобы извлечь элемент из массива по индексу - нужно воспользоваться квадратными скобками []
, внутри них указать индекс.
На что хотелось бы обратить внимание - это на проверки, которых нет. Если метод findIndex
не найдет элемент удовлетворяющий условию, то в этом случае возвращается -1
. А значит на строке tasksArray[result].crossout = true;
мы можем получить потенциальную ошибку. По-хорошему нужно последние две строки приведенного Вами кода поместить в блок с условием if (result != -1) { ... }
.
На просторах enSO есть хороший вопрос с множеством полезных ответов, которые подходят для Вас, прошу ознакомиться вот тут: React: How do I update state.item[i] on setState?
Также, полезно читать документацию на MDN: Array.prototype.findIndex
Есть такая библиотека как immutability-helper (ссылка на GitHub - kolodny/immutability-helper), ну очень полезный хелпер, который изменяет копию данных без изменения исходного источника. Для начала ознакомьтесь с его основным методом update
, в Вашем случае должно будет получиться что-то вроде такого кода:
// нашли индекс элемента, удовлетворяющего условию поиска
const result = this.state.tasksArray.findIndex(item => item.id === id);
// если элемент был найден, то поменяем значение
if (result != -1) {
// $set - это команда на замену значения
this.setState({
tasksArray: update(this.state.tasksArray, {
[result]: {
crossout: { $set: true }
}
})
});
}
Не забудьте после установки пакета добавить импорт метода update
в свой код:
import update from 'immutability-helper';
let tasksArray = Object.assign([], this.state.tasksArray);
let result = tasksArray.findIndex(item => item.id === id);
tasksArray[result].crossout = true;
this.setState({ tasksArray });
или
let tasksArray = Object.assign([], this.state.tasksArray);
tasksArray.find(item => item.id === id).crossout = true;
this.setState({ tasksArray });
Виртуальный выделенный сервер (VDS) становится отличным выбором
Верстаю сайт отеля и нужно добавить плагин с выбором даты заезда и выезда, скажите пожалуйста, что это за плагин?