# Vue.observable

我們習慣用 Vuex 來解決狀態的共享問題，但在小專案中就會增加程式碼的負擔和將程式碼複雜化的煩惱，所以可以使用 Vue.observable({...}) 的方式，讓資料也可以響應。

返回的狀態可以直接用於渲染函式和計算屬性內，並且會在發生改變時觸發相對應的更新。也可以做為最小化的跨組件狀態儲存器。

const state = Vue.observable({ count: 0 });

const Demo = {
  render(h) {
    return h(
      'button',
      {
        on: {
          click: () => {
            state.count++;
          },
        },
      },
      `count is: ${state.count}`
    );
  },
};

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17

# 參考連結

響應式資料 (opens new window)

← Vue.filter vm.$watch →