У меня есть модель, в которой я инициализирую массив с успехом ajax после установки модели
var self = this;
$.getJSON("somejson.json",
function (data) {
var list = [];
list = data.list.map(function (item) {
return { id: item.id, text: item.text };
});
self.selectableItems = list;
});
У меня есть метод click для каждого из этих элементов, который удаляет элемент из selectableItems
select: function (item) {
this.selectableItems.pop(item);
},
selectableItems визуализируется правильно, но когда я мутирую массив, dom не обновляется. Хотя фактический массив изменяется правильно.
Я проверил это, получив вычисляемое свойство, которое возвращает количество selectableItems. Этот счетчик обновляется правильно, когда элемент удален, но dom все еще показывает элемент.
Я также заметил, что когда я жестко кодирую значение selectableItems в ajax, все работает так, как ожидалось!
self.selectableItems = [{ id: 1, text: "adsad"}];
Я знаю о предостережениях мутации массива в vue. Но я чувствую, что у меня отсутствует кое-что основное, поскольку я только начал изучать Vue. Может кто-то указать на то, что мне не хватает?
Array.pop()
удаляет последний элемент из массива, он не принимает никаких аргументов. Он удаляет только последний элемент любого аргумента, который вы передаете ему.
Эта причина, по которой вычисленное свойство, показывающее счетчик массива, работает как последний элемент, удаляется, но не тот элемент, который вы хотите.
Вместо этого используйте Array.splice().
передайте индекс вашему методу щелчка следующим образом:
<ul>
<li v-for="(item, index) in selectableItems" @click="select(index)>{{item}}</li>
</ul>
скрипт
select: function (index) {
this.selectableItems.splice(index, 1);
},
Array.prototype.pop()
дляthis.selectableItems.pop(item);
? Какой аргумент? developer.mozilla.org/en/docs/Web/JavaScript/Reference/...