更新对象中数组的值时出现奇怪的问题

Question

假设以下状态对象：

const state = writable({});
$state = {value: ['a','b','c'], label: 'test'};

并像这样替换数组中的一项特定项目：

$state.value[1] = 'e';

好吧，到目前为止没什么大不了的。但是当我想删除该数组的最后一项时，如下所示：

const removeLastItem = function () {
   $state.value = $state.value.pop();
}

上面的方法一直有效，直到达到数组的更改项（即，本例中只有一次迭代有效，因此仅删除最后一个“c”值，而第二个和新更新的“e”值似乎无法删除） .

请注意，此行为仅在数组项发生更新时才会发生。我应该使用扩展运算符来分配/替换数组的第二个值吗？

Answer 1

pop

返回已删除的项目，而不是剩余的项目。

您正在用所述删除的项目替换数组。
当您对号码拨打

pop

时，任何进一步的尝试都将导致运行时错误。

您可能想要这样的东西：

const removeLastItem = function () {
  $state.value.pop();
  $state = $state; // force update
}

（虚拟分配在 Svelte 3/4 中是必要的，因为反应性基于分配。）

替换索引 1 处的元素应该不会对此产生任何影响。