[Vue]对Vue，Vuex.store，mixins理解

== vue ==

this.$dispatch、this.$broadcast弃用，改用this.$emit、this.$on

this.$emit：子组件调用父组件传给子组件的方法
this.$on/this.$once：创建一个事件监听，可用this.$emit触发
this.$off：删除一个事件监听

this.$set：新增/修改嵌套对象属性，可触发视图更新

 

 

== vuex.store ==
PS：当作全局变量
PS：里面的方法都是对state的变量进行修改

state：存放变量数据
-> this.$store.state.变量名
getters：返回计算结果，相当于C#的GET/SET方法中的GET
-> this.$store.getters.变量名
mutations：同步方法，相当于C#的GET/SET方法中的SET
-> this.$store.commit('方法名', 参数...);
actions：对mutations方法进行异步操作，建议后缀加上Asyn
-> this.$store.dispatch('方法名', 参数...);

mapState/mapGetters/mapMutations/mapActions：映射state/getters/mutations/actions到this
-> import { mapState, mapGetters,mapMutations, mapActions } from 'vuex';
-> computed: {
-> ...mapState(['变量名'...]), // 不用在data声明，即可在本页内<template><script>使用
-> ...mapGetters(['变量名'...]), // 同上
-> },
-> methods: {
-> ...mapMutations(['方法名'...]), // 可在本页内调用，this.方法名(参数...);
-> ...mapActions(['方法名'...]), // 同上
-> },

 

== mixins ==
PS：内部方法可以被页面方法重写，参考：https://www.jianshu.com/p/bcff647d24ec
PS：官方建议添加前缀$_，防止污染

-> import 混合对象 from '混合对象路径';
-> mixins: [混合对象...], // 此处会调用内部生命周期
// 映射到this，可在本页内调用，this.混合对象内部方法名(参数...);