当你使用终端命令建立vue项目时候，我们可能需要父组件向孙组件传值，或者非父子组件传值，或子组件向父组件传值的时候，我们可以使用vuex实现，

1：首先建立vue项目：

vue init wepack my-project

cd my-project

npm install

npm run dev（可写可不写）

2：在项目文件夹中安装vuex

npm install vuex

3：而后在main.js中添加如下代码：

import Vue from 'vue'

import Vuex from 'vuex'

Vue.use(Vuex)

4：在main.js中添加如下代码：

const store = new Vuex.Store({

state: {

showModal:false

},

mutations: {

}

});

new Vue({

el: '#app',

router,

store,//一定要注意这一步骤

render: h => h(app)

});

5：在vue组件中获取showModal的值，并且更改（请注意：这里边的store相当于一个全局变量，所有的vue文件都可以获取到它，并且更改，）

import addClassPopup from './addClassPopup.vue'

export default{

data(){

return{

msg:'hello vue'

}

},

computed: {

showModal () {

return this.$store.state.showModal;

}

},

methods: {

showPop () {

this.$store.state.showModal = true;

}

},

components:{

addClassPopup

}

}

6：要想实现弹出框的弹出和隐藏，我们只需要在绑定事件中修改showModal的值即可，此种解决办法个人觉得仍有纰漏，需要后续改进