Svelte 对数组操作的反应性

Question

我在学苗条。

本教程指出响应性基于赋值，因此 array.push() 等数组操作必须具有赋值。

array.push()可以转换为numbers = [...numbers, numbers.length + 1] .

如何转换pop、shift、unshift、splice等类似操作？

Answer 1

Unshift最简单，使用push的逆向构造即可

let arr = [1,2,3,4]
arr = [0, ...arr]

可以使用数组解构重写 Shift，获取第一个元素，然后将其余元素散布回数组中-

let arr = [1,2,3,4];
[first, ...arr] = arr;

对于 pop 和 splice 并没有真正的 快捷方式 你可以遵循，但你总是可以在完成操作后重新分配：

arr.pop()
arr = arr

Answer 2

不幸的是，这些方法（pop、shift、unshift、push）不起作用，这是因为系统需要使用赋值运算符 (=) 才能正常工作。

您可以使用 slice 和 concat 来实现大多数其他方法。

// pop
let arr = [1,2,3];
arr = arr.slice(0, -1);
console.log(arr);

// shift
let arr = [1,2,3];
arr = arr.slice(1);
console.log(arr);

// splice
let arr = [1,2,3,4,5,6,7,8,9,10];
// delete number 6 from the list at index 5
const index = 5;
arr = arr.slice(0, index).concat(arr.slice(index + 1));
console.log(arr);

// push
let arr = [1,2,3];
arr = arr.concat([4]);
console.log(arr);

// unshift
let arr = [1,2,3];
arr = [0].concat(arr);
console.log(arr);

Svelte 对数组操作的反应性

Svelte's reactivity with array operation

javascript

svelte-3