vuex---兄弟组件间传值
需求描述:
如下图:TopHeader组件需要获取leftNav中点击的菜单的菜单名称,当leftNav中点击菜单时,把相应的菜单名称显示在topHeader中
解决方法:
借助vuex,解决方法如下步骤:
1、安装vuex,命令为【npm install vuex --save】
2、创建store:在项目【src】目录下新建文件夹【store】及【store】下新建文件【index.js】。初始化state对象。【currentMenu】变量用于存储当前显示菜单页的名称。
3、在【main.js】中注册store
4、leftNav组件中定义菜单点击方法,并在该方法中将菜单名参数传递给store.js中state对象中的【currentMenu】变量
5、在topHeader组件中引入【currentMenu】