组件公用数据 Vue.observable( )

注意（适合小项目，不用vuex的情况下使用）

1.创建store.js 最好和main.js平级创建文件

import Vue from 'vue'

export const store = Vue.observable({
  name: '李四'
})
export const mutations = {
  setName (data) {
    store.name = data
  }
}

2.在两个组件中调用改写 （如果全局都有使用，也可在mian.js通过Vue.pototype来全局挂载，不用每个组件都引入）

<template>
  <el-row>
    <span @click="findClick">{{data}}</span>
  </el-row>
</template>

<script>
import {store, mutations} from '@/store.js'
export default {
  name: 'mainView',
  data() {
    return {
      data: ''
    }
  },
  mounted() {
    this.data = store.name // 引入store.js 通过定义的store直接获取
  },
  methods: {
    findClick() {
      this.$router.push({path: '/login'})
      mutations.setName('我改了') // 引入store.js 通过定义的mutations下边的方法修改
    }
  }
}
</script>

<style scoped lang="less">
span {
  cursor: pointer;
}
.add {
  pointer-events: none;
}
</style>