Svelte 更新數(shù)組和對象

由于 Svelte 的反應(yīng)性是由賦值語句觸發(fā)的，因此使用數(shù)組的諸如 push 和 splice 之類的方法就不會觸發(fā)自動更新。例如，點(diǎn)擊按鈕就不會執(zhí)行任何操作。

解決該問題的一種方法是添加一個多余的賦值語句：

function addNumber() {
	numbers.push(numbers.length + 1);
	numbers = numbers;
}

但還有一個更慣用的解決方案：

function addNumber() {
	numbers = [...numbers, numbers.length + 1];
}

你可以使用類似的模式來替換 pop、shift、unshift 和 splice 方法。

賦值給數(shù)組和對象的 屬性（properties） （例如，obj.foo += 1 或 array[i] = x）與對值本身進(jìn)行賦值的方式相同。

function addNumber() {
	numbers[numbers.length] = numbers.length + 1;
}

一個簡單的經(jīng)驗(yàn)法則是：被更新的變量的名稱必須出現(xiàn)在賦值語句的左側(cè)。例如下面這個：

const foo = obj.foo;
foo.bar = 'baz';

就不會更新對 obj.foo.bar 的引用，除非使用 obj = obj 方式。