Svelte 绑定Store
如果 store可写入的(即具有set方法),则可以绑定其值,就像可以绑定局部组件状态一样。在此示例中,我们有一个可写 store:name和一个派生store :greeting,尝试更改<input>标签:<input bind:value={$name}>现在,更改name的输入值 ,其值和依赖项都将获得更新。我们还可以直接分配store值在组件内部,尝试添加<button> 标签:<button on:click="{() => $name += '!'}">
Add exclamation mark!
</button>此处 $name += '!' 相当于 name.set($name + '!')。示例代码App.svelte<script>
import { name, greeting } from './stores.js';
</script>
<h1>{$greeting}</h1>
<input value={$name}>stores.jsimport { writable, derived } from 'svelte/store';
export const name = writable('world');
export const greeting = derived(
name,
$name => Hello ${$name}!
);