1.下載 

npm install vuex --save

 2.在main.js中 

import Vue from 'vue'
import vuex from 'vuex'         //  1

Vue.use(vuex)                  //  2

var store = new vuex.Store({   // 例項store物件    3
  state:{
    show:false
  }
})

new Vue({
  el: '#app',
  store,                     //4
  router,
  components: { App },
  template: '<App/>'
})

3.使用

父元件：

<template>
  <div>
    <button @click="$store.state.show = true">點選</button>   //這裡用到main.js中定義的show
    <v_dialog></v-dialog>
  </div>
</template>

<script>
import v_dialog from './v_dialog.vue'
export default {
  components:{
    v_dialog
  }
}
</script>
 

子元件： 

<template>
  <el-dialog title="提示" :visible.sync="$store.state.show">   
     <span>這是一段資訊</span>
     <span slot="footer" class="dialog-footer">
        <el-button @click="$store.state.show = false">取 消</el-button>
        <el-button type="primary" @click="$store.state.show = false">確 定</el-button>
      </span>
  </el-dialog>
</template>

<script>
export default {}
</script>