state
state:定义公共数据
全局state
任何组件内都可以访问
在vuex的配置项类里面定义:![](https://img-blog.csdnimg.cn/3a1ade853fd142c29a88df9663f671f4.png#pic_center)
访问:
在插值表达式中:插值表达式前面不用加this 在下面的模块中才需要加
![在这里插入图片描述](https://img-blog.csdnimg.cn/3a16b49a515442e19f5bf077f2c609bf.png#pic_center)
在下面的模块中:
![在这里插入图片描述](https://img-blog.csdnimg.cn/d26f1cae88224cb7912ac49c85e2157e.png?x-oss-process=image/watermark,type_ZHJvaWRzYW5zZmFsbGJhY2s,shadow_50,text_Q1NETiBAY3Z2dnZ2dnZ2dnY=,size_10,color_FFFFFF,t_70,g_se,x_16#pic_center)
modules的作用
拆分模板,把复杂的场景按模块来拆开 访问模块中的数据,要加上模块名
使用modulse中的state
创建一个modulse 在modulse中定义state:
![在这里插入图片描述](https://img-blog.csdnimg.cn/51f8e5d1b25e4a71bd63b62d7e708e17.png#pic_center)
在vuex中引入,并在modulse 属性中配置 模块名:引入的模块名
![在这里插入图片描述](https://img-blog.csdnimg.cn/4183c8edbe9e4eb89af9f2203aea8909.png#pic_center)
![在这里插入图片描述](https://img-blog.csdnimg.cn/16dfddc5993042bb8e920f7579d5af7d.png#pic_center)
访问:如果定义了namespaced: true,则需要在state后面加上模块名 推荐设置true
插值表达式中:
![在这里插入图片描述](https://img-blog.csdnimg.cn/edb568b5712d4ac0a926627db7f797b7.png#pic_center)
在下面的模块中:
![在这里插入图片描述](https://img-blog.csdnimg.cn/f4a6bceefbe54a22ba1c7c24447911c7.png?x-oss-process=image/watermark,type_ZHJvaWRzYW5zZmFsbGJhY2s,shadow_50,text_Q1NETiBAY3Z2dnZ2dnZ2dnY=,size_10,color_FFFFFF,t_70,g_se,x_16#pic_center)