Текущий проект, над которым я работаю, широко использует vuejs, и я пытаюсь использовать Lodash для доступа к некоторым базовым вспомогательным функциям массива. На простой кнопке стиля "лайк" в шаблоне vue есть следующее:
<button class="btn btn-xs" v-bind:class="appreciated" v-on:click="toggleAppreciate()"><i class="fa fa-heart"></i> Appreciate</button>
Вычисленное свойство выглядит так:
appreciated: function()
{
return _.indexOf(this.global.userAppreciates, this.entity_id) > -1 ? 'btn-primary' : 'btn-default'
}
Нажатие на кнопку отправляет простой запрос ajax, и сервер отвечает статусом переключения «добавлено» или «удалено». Я использую следующий код, чтобы изменить набор «ценителей»:
if (response.data.type === 'added')
{
return this.global.userAppreciates.push(this.entity_id)
}
return _.pull(this.global.userAppreciates, this.entity_id)
Добавленный метод, использующий простой javascript, работает нормально. Просмотр vuetools показывает, что количество элементов в userAppreciates было обновлено, и кнопка действительно меняет состояние. Однако - использование метода Lodash _.pull для удаления элемента из массива не переключает состояние вычисленного свойства, даже если элемент удален из хранилища. Однако если я использую простой javascript и делаю что-то вроде этого:
let index = this.global.userAppreciates.indexOf(this.entity_id)
this.global.userAppreciates.splice(index, 1)
Хранилище также обновляется, но вычисленное свойство действительно меняет состояние, а класс кнопки изменяется.
Есть ли что-то особенное в том, как Lodash обрабатывает эти методы, что заставляет Vuejs не улавливать изменение свойства? Приветствуются любые разъяснения.