vuex的理解以及应用

vuex 是一个状态管理工具 管理data数据

vuex采取集中式  将组件需要通讯的数据放在 vuex里面

  (面试)  为什么可以把本地的存 其他地方用可以拿 为什么还用vuex??

    Vuex是响应式的 localStorage不是响应式的

    响应式:就是立马更新

特点:1. 集中式  2.响应式

什么时候使用:开发大型单页面

1.下载 npm i vuex

2.引入 script src="./vuex.js"

3 创建一个仓库 const store=new Vuex.Store()

4.将store 挂载到app上

5.  state 里面放数据

const store=new Vuex.Store({state:{num:10,name:"马哥'',}})

6 读取数据 {{$store.state.name}}

const store=new Vuex.Store({

strict:true ,  开启严格模式 

state:{num:10,name:"马哥'',}})

//

state:相当于data

mutation :相当于methods

const store=new Vuex.Store({state:{num:10,name:"马哥'',},

mutations:{ updataname(state){  state.name="大哥"  }    }

}) 

mutation里面第一个方法拿到的都是 state

在vue的methods 里面 当点击时触发fn  fn=>updataname

fn(){this.$store.commit("updataname")} 

fn(){this.$store. commit("方法名",{name:"蛇皮"}) } 

mutations:{ updataname(state,payload){  state.name=payload.name  }    },

就是每个里面有自己独立的方法 vuex里面也有自己的 方法