vuex属性:state,getters,actions,mutations

75 阅读1分钟

Vuex是一个专为Vue.js应用程序开发的状态管理模式,采用集中式存储管理应用的所有组件的状态,并以相应的规则保证状态以一种可预测的方式发生变化; state:类似存储全局变量的数据 getters:提供用来获取state数据的方法 actions:提供跟后台接口打交道的方法,并调用mutations提供的方法; mutations:提供存储设置state数据的方法

image.png

属性之间的调用关系: (1)组件Vue Component通过dispatch来调用actions提供的方法 (2)actions除了可以和api打交道外,还可以通过commit来调mutations提供的方法 (3)最后mutations将数据保存到state中 (4)Vue Components还以通过getters提供的方法获取state中的数据

step1:创建store.js文件

image.png

step2:在main.js文件中引入

image.png step3:使用 getters:

image.png actions:

image.png