正文
以简单计数器为例,计数变量放在 store-state 中,它使用 svelte/store
中的 writable
方法,它会返回一个对象,通过调用对象上的 .set(val) 进行重置、调用 .update((val) => ...) 进行更新、调用 .subscribe(val => ...) 进行订阅。
<script> // 创建仓库 import { writable } from ‘svelte/store‘ // 声明一个可写的 state 并指定初始值 const count = writable(0) // 用于接收、订阅 count 值变动 let countVal; // 订阅 count.subscribe((val) => { // 订阅 store-state countVal = val; }); // 增加 const increment = () => { // 更新 store-state count.update((n) => n + 1); }; // 减少 const decrement = () => { // 更新 store-state count.update((n) => n - 1); }; // 重置 const reset = () => { // 重置 store-state count.set(0); }; </script> <h1>{countVal}</h1> <button on:click={increment}>+</button> <button on:click={decrement}>-</button> <button on:click={reset}>reset</button>