Vue.observable小型状态管理

// store.js

import Vue from 'vue'
export const store = Vue.observable({
  name: '张'
})
export const mutations = {
  SET_NAME (data) {
    store.name = data
  }
}

// 组件1 about.vue
<template>
  <div>
    <h1>{{name}}</h1>
    <button @click="mutationsHandle">mutations</button>
  </div>
</template>
<script>
import { store, mutations } from '../observable'
export default {
  computed: {
    name () {
      return store.name
    }
  },
  methods: {
    mutationsHandle () {
      mutations.SET_NAME('老王')
    }
  }
}
</script>