リアクティブな let/var 宣言
ルーンモードでは、リアクティブな状態は $state ルーン で明示的に宣言されます。
レガシーモードでは、コンポーネントの一番上に宣言された変数は自動的にリアクティブとみなされます。これらの変数を再割り当てまたは変更 (count += 1 または object.x = y) すると、UI が更新されます。
<script>
let count = 0;
</script>
<button on:click={() => count += 1}>
clicks: {count}
</button>Svelte のレガシーモードのリアクティビティは割り当てに基づいているため、.push() や .splice() などの配列メソッドを使用しても、自動的に更新がトリガーされません。その後の割り当てが必要で、コンパイラに UI を更新するように「指示」する必要があります。
<script>
let numbers = [1, 2, 3, 4];
function addNumber() {
// this method call does not trigger an update
numbers.push(numbers.length + 1);
// this assignment will update anything
// that depends on `numbers`
numbers = numbers;
}
</script>前へ 次へ