Vue.observable( object )(局部状态共享_响应式)

官方说法：

让一个对象可响应。Vue 内部会用它来处理 data 函数返回的对象。

返回的对象可以直接用于渲染函数和计算属性内，并且会在发生变更时触发相应的更新。也可以作为最小化的跨组件状态存储器。

个人看法：

vuex是vue的全局性状态管理，observable可以说是局部的状态管理，可以用作局部状态的共享(无父子兄弟关系之分)

案列：

//observable.js
import Vue from 'vue'

const state = Vue.observable({
  name: 'json',
  posts: ['post 1', 'post 2']
})

export default () => state

export const insetPost = (post) => state.posts.push(post)

//one.vue
<template>
    <el-input v-model="search" />   
    <el-input v-model="user.name" />
    <button @click="insetPost(search)">新增</button>
 </template>
<script>
import { default as user, insetPost } from './observable.js'  
export default {
  data() {
    return {
      search: '',
    }
  },
  computed: {
    user
  },
  methods: {
    insetPost
}
</script>     
 //two.vue    
 <template>
    <div  >{{user.name}}</div>
 </template>
<script>
import { default as user, insetPost } from './observable.js'  
export default {
  computed: {
    user
  },
  methods: {
    insetPost
}
</script>