Vue. js не реагирует на замененный элемент массива - PullRequest
0 голосов
/ 29 апреля 2020

В Vuex Store у меня есть массив объектов. После удаления и добавления объекта в массив компонент перестает реагировать на свойства элемента массива. Понятия не имею, что я сделал не так.

У меня есть отдельная проблема в самом маленьком проекте на GitHub с шагами для воспроизведения, содержащимися в README.

Состояние Vuex содержит массив devices с экземплярами класса Device. В классе есть методы start и stop, которые имитируют некоторые реальные действия устройства с Обещаниями, разрешенными после истечения времени ожидания. Каждое устройство имеет свойство state с двумя ключами: start и stop, каждое из которых получает значения 0 - начальное состояние, 1 - запуск / останов начался, 2 - запуск / останов завершен. Хранилище предоставляет доступ к массиву devices через mapState для компонента RunDevices. Компонент имеет кнопки для отправки действий Store, останавливающих или запускающих все устройства, и имеет цветные fab-кнопки для отображения для каждого устройства значений state.start (или state.stop) разных цветов для разных целых чисел. Хранилище знает, что состояние устройства изменяется по мере его мутации.

Зло начинается, когда другой компонент Settings удаляет устройство из массива и добавляет новое устройство в ту же позицию 1. При нажатии кнопки запуска, отображается правильный цвет состояния второго (индексированного 1) устройства start: 1 (запуск начался), но цвет для start: 2 (запуск завершен) никогда не отображается. В консоли я вижу это правильное состояние в Store.

Ситуация мгновенно разрешается, если какой-то хак (инициируемый из консоли) вызывает повторный рендеринг компонента.

...