reactjs и состояние обновления массивов

#reactjs

Вопрос:

вероятно, это какая-то глупая ошибка, но я не могу выяснить, что происходит.. Вот мой пример состояния:

 this.state = {
  data: {
    some data: ['some data']
  }
}

Теперь я пытаюсь удалить определенный индекс из массива. Вот мой подход:

 const newArr =  this.state.data[key].filter(item => item !== value);

В приведенном выше коде я получаю то, что хочу, то есть массив без одного конкретного элемента

 data: {
   ...this.state.data,
   [key]: newArr
},

Но это не работает.. Что здесь не так?

1. Что именно «не работает»? Какой результат вы ожидаете и какой результат вы получаете?

2. Ожидаемым результатом будет массив без одного элемента, который функция filter выбросила. Вместо этого по какой-то причине значения в моем массиве дублируются. Я запускаю функцию по щелчку, чтобы установить состояние, и после нескольких щелчков массив растет.

Ответ №1:

В вашем коде вы добавляете отфильтрованный массив к элементам в исходном массиве. Это ваше намерение?

 data: {
    ...this.state.data,
    [key]: [
        ...this.state.data[key], // individual entries
        newArr, // array
    ],
},

//result:
data: {
  'some key': [
    "item 1", // string from original
    "item 2", // string from original
    [ "item 1", "item 2"] // array
  ]
}

Если вам просто нужны отфильтрованные элементы:

 data: {
    ...this.state.data,
    [key]: newArr // the filtered array 
},

//result:
data: {
  'some key': [
    "item 2", // filtered items 
  ]
}

1. хм, хороший улов. Я хочу переопределить некоторый ключевой массив, не добавляя новый.. итак, это должно выглядеть так? data: { ...this.state.data, [key]: newArr },

2. на самом деле мой плохой.. У меня это уже было. Я просто вставил неправильный фрагмент кода. К сожалению, это не работает :/ Я обновил основной пост.

Ответ №2:

Хорошо, это была моя ошибка. Сам код был правильным. Состояние было настроено дважды из-за моей ошибки.