vuex笔记


一.vuex是用来干什么

vuex是vuejs应用程序的状态管理模式,这个状态可以理解为数据,一个vuejs应用程序的公共数据可以用vuex

来进行管理。



二.为什么要用vuex

1.一个vuejs应用,如果所有的数据都通过组件之间相互传递的话,整个程序就会变得非常负载,维护起来也极其



三.使用

1.获取vuex的数据

在要获取的组件中的计算属性中取vuex的的值,这个必须是在计算属性中

var get=new Vue({

  computed:{

 getmsg(){

       return vuex.state.data      //vuex实例中的数据

 }

}

})


2.改变vuex中的数据


一般来说,在组件中的methods方法触发action中的动作

methods:{

    add(){

         vuex.dispatch('某个ation的方法',参数)     //触发vuex的中的action中的方法,这个参数可写可不写,在action方法的第二个参数

   }

}

3.再由vuxe实例action对象提交快照

actions:{

     方法名({{commit}},参数)   {

            commit(快照名,参数)    //这个参数随自己意愿,可以不用第二个参数的数据

     }           

也可以这么用

    add(obj,参数){

     obj.commit(快照)        //不用es6的函数解构

}


//  这里的第一个参数是提交快照的对象,不是vuex实例,用es6的函数解构把commit提取出来,参数是dispatch中传过来的(可写可不写)

}

}

最终由快照改变vuex中的数据

mutations:{

     add(state,参数){      //state这个第一个参数就是vuex中的state,参数是由ation传递

       state.count+=参数

}

}


最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • Vuex是什么呢? 通俗的说法呢就是: 是一种设计思想,是把所有组件所有状态统一放在一个state空间管理,st...
    F1503阅读 322评论 0 1
  • Vuex 是什么? ** 官方解释:Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式**。它采用集中...
    Rz______阅读 2,328评论 1 10
  • 安装 npm npm install vuex --save 在一个模块化的打包系统中,您必须显式地通过Vue.u...
    萧玄辞阅读 2,976评论 0 7
  • 全局安装vuex 建立独立文件 在页面导入,本例子是在vue-cli中测试,发现一直报错,报错插件为eslint-...
    马贞晓阅读 187评论 0 0
  • Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式。它采用集中式存储管理应用的所有组件的状态,并以相应...
    白水螺丝阅读 4,704评论 7 61