vue笔记

0.computed与watch

computed是基于它们的依赖进行缓存的，依赖发生变化，则计算属性发生变化。

watch是当watch 的值发生变化，则执行其中的函数

1.vuex

Vuex 的状态存储是响应式的。当 Vue 组件从 store 中读取状态的时候，若 store 中的状态发生变化，那么相应的组件也会相应地得到高效更新。

你不能直接改变 store 中的状态。改变 store 中的状态的唯一途径就是显式地提交 (commit) mutation（devtool）。这样使得我们可以方便地跟踪每一个状态的变化，从而让我们能够实现一些工具帮助我们更好地了解我们的应用。

Action 提交的是 mutation，而不是直接变更状态。

配置store选项，指定为store对象，会自动将store对象注入到所以子组件当中，

a ） 在子组件中通过this.$store访问该store对象。

b ）state定义属性（状态，数据）；

      getters用来获取属性；（可以认为是 store 的计算属性）

      actions用来定义方法（动作)；

      commit提交变化mutations；

      mutation定义变化

c )   通过两个方法访问: 

      mapState获取state，mapGetters获取getters（数据），mapActions获取Actions（动作）

3. Vuex 中的 mutation 非常类似于事件：每个 mutation 都有一个字符串的事件类型 (type)和 一个回调函数 (handler)。这个回调函数就是我们实际进行状态更改的地方，并且它会接受 state 作为第一个参数

要唤醒一个 mutation handler，你需要以相应的 type 调用store.commit方法

在 Vuex 中，mutation 都是同步事务：

4.Action 函数接受一个与 store 实例具有相同方法和属性的 context 对象

5. 项目创建过程

1）建立store ,把公共的getters，actions，mutations,以及types，modules建立，并从index引入export default newVuex.Store（）

2）建立routert，从index引入 export default newRouter()

3）App.vue是主组件，main.js是主入口js。在main.js中创建实例，挂载主组件。

4)  this.$store.dispatch('xxxx')  抛送xxxx事件（一般写在公共方法里面）

6.对于模块内部的 action，局部状态通过context.state暴露出来，根节点状态则为context.rootState

rootState,// 等同于 store.state, 只存在于模块中

7.watch响应式地监测一个 getter 方法的返回值，当值改变时调用回调函数。getter 接收 store 的状态作为唯一参数