vue2.0 --- vuex (一)

之前做vue项目中没有使用vuex  一直使用vue-router 组件、路由一直的转换,烦不胜烦

今天研究一下vuex

vuex是什么:

  vuex是专门为vue.js应用程序开发的状态管理模式.

解决了什么问题:

  1、多层嵌套组件之间的传参繁琐问题,兄弟组件之间传参困难问题,各组件之间耦合度过高问题

  2、不同状态中的行为需要多份拷贝的问题

  3、以上问题引发的代码维护困难的问题

核心思想:

  抽取组件的共享状态,以一个全局单例的模式进行管理

核心:

  store(仓库)

开发中借鉴到的技术:Flux 、redux、The Elm Architectrue

vue2.0 --- vuex (一)

忠告:  如果你的项目够简单就完全没有必要使用vuex ,但是如果你的是一个中大型项目,那么就建议你使用vuex 否则你会疯掉的

下面给一个简单的例子

<div id="app">
<p>{{ count }}</p>
<p>
<button @click="increment">+</button>
<button @click="decrement">-</button>
</p>
</div>
const store = new Vuex.Store({
state: {
count: 0
},
mutations: {
increment: state => state.count++,
decrement: state => state.count--
}
}) const app = new Vue({
el: '#app',
computed: {
count () {
return store.state.count
}
},
methods: {
increment () {
store.commit('increment')
},
decrement () {
store.commit('decrement')
}
}
})

核心组成:

  State: 单一状态树

  Getters:

  Mutations:

  Actions:

  modules:

详细用法看我三月五号写的那份博客   vue-cli+webpack+router+vuex---之vuex使用

  

上一篇:嵌入式开发(一) Ubuntu12.04下搭建交叉编译环境


下一篇:Ubuntu12.04下搭建Java环境