writable store 是甚麼

writable store 是甚麼呢，在介紹完readable store後，今天要來跟大家分享的就是 writable store 這個東西，相較於readable store唯讀的store， writable store 是可以讓元件寫入、更新的 store，接下來在說明一下甚麼時候用跟如何用。

本文同步放置於此

writable store 甚麼時候用

writable store 的使用時機就是在於有許多元件會去更新那個資料，然後有另外些元件會讀取該資料時使用，簡單舉個例子就是登入後會更新使用者資訊，登出後會清除使用者資訊，還有部分地區會接露目前登入的使用者資料。

writable store 怎麼用

如同readable store， writable store 也是宣告在js之中，所以我們先寫一個使用者名稱的 writable store ，相關內容如下。

// In stores.js
import {writable} from 'svelte/store';
 
export const nameStore = writable('Login');

接下來我們在App.svelte內import這個nameStore進來並使用，例子如下所示。

<script>
import {nameStore} from './store.js';
</script>

<div>
Hello {$nameStore}
</div>

然後我們再加上另外一個元件專門更新nameStore，內容如下列所示。

<script>
import {nameStore} from './store.js';
</script>

<input type="text" bind:value={$nameStore} />

如此當nameStore被更新時，App.svelte的顯示也會一同更新，這個東西是不是很方便呢，最後說明一下writable這方法第一個參數是初始值，第二個參數是callback函式，裡面要實作一個set的方法跟回傳一個update的callback方法。

小結

在今天跟大家分享一下 svelte store 相關文章的第二篇 writable store 相關知識，希望大家能夠有所收穫。