vuex的使用步骤

用户2246220511315
176 阅读1分钟

vuex的使用步骤

image.png

image.png

image.png

image.png

image.png

store和mutations的使用

image.png image.png

image.png

image.png

image.png

image.png

什么时候使用计算属性

当使用state中的数据时，不用计算属性。如果这个数据需要经过一系列变化之后，再展示在页面上，这时就可以使用计算属性

getters

1.当我们使用store中的数据，直接使用该数据，就不用getter 2.如果我们使用store中的数据count，但是需要使用count的平方，就把store中的数据放在getters中，相当于是计算属性computed 在组件的计算属性中定义的方法只能在当前页面的组件使用，而在store中的getters中定义的方法在所有页面都可以使用

image.png

image.png getters方法有两个参数，第一个参数表示store中的state，第二参数表示getters

getters传参

image.png

image.png

image.png

image.png

mutations的使用

image.png

image.png

image.png

image.png

mutations的另一种提交方式

image.png

image.png

image.png

action

image.png

image.png

image.png

actions方法中返回一个promise对象

image.png

image.png

modules

image.png 将store中的数据划分模块，a:moduleA b:moduleB modules中的这些a,b模块是放到总的store中的state中

image.png

image.png

image.png

image.png

模块里面的mutations

image.png

image.png

image.png

模块里面的getters

image.png

image.png

image.png

image.png

模块里的actions

image.png

image.png

image.png

image.png

avatar
文章
阅读
粉丝