# State Manangement

> * 如有錯誤處指正或任何建議，懇請留言，感謝!
> * 搭配 ChatGPT 進行翻譯，請小心服用
> * ▸ ... 為英文原文

:::spoiler ...
Use [`useStore()`](https://qwik.builder.io/docs/components/state/#usestore) to store the state of the component. The store's purpose is to:

1. store the state of the component
2. present the state as a proxy that can observe read/writes to the store
3. serialize the state of the store into JSON on application pause.
4. observe which properties of the store are used in a component template and create subscriptions to the store. The subscriptions are then used to automatically update the component template if a store changes.
:::
使用[`useStore()`](https://qwik.builder.io/docs/components/state/#usestore) 儲存元件的狀態，儲存的目的是：
1. 儲存元件的狀態
2. 將狀態呈現為可觀察到儲存的讀/寫的代理
3. 在應用程式暫停時將儲存的狀態序列化為JSON
4. 觀察元件模板中被使用的儲存屬性，並訂閱那些儲存。如果儲存更改時，元件模板將自動更新。

:::spoiler ...
Stores are declared inside the component's function using the [`useStore()`](https://qwik.builder.io/docs/components/state/#usestore) function. Wrap the `github` assignment in the `useStore(...)` function call to create a store.
:::
使用[`useStore()`](https://qwik.builder.io/docs/components/state/#usestore)在元件的函式內宣告儲存。包裹在`useStore(...)`函式調用中的`github`賦值來創建儲存。
:::spoiler ...
> **NOTE** In this example, the store never changes. Therefore there is no way to observe automatic template re-rendering. In the next example, we will add a listener to the `<input>` to demonstrate automatic template re-rendering.

:::
>***注意*** 在此範例中，儲存永遠不會更改。因此無法觀察到自動更新的模板重新渲染。在下一個範例中，我們將加入一個監聽器在`<input>`中，來演示自動更新的模板重新渲染。

###### tags: `Simple Application`