vuex实现原理
Posted
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了vuex实现原理相关的知识，希望对你有一定的参考价值。
参考技术A vuex是在每个组件上注入this. store获取共享的状态，定义操作state的方法。首先使用vue.use(vuex)表明vuex是vue的插件，只能被vue使用——实例化Store并传入参入——Store注入到根组件上。以上三个步骤便可以使用vuex实现数据在组件中的共享了。
当使用到vue.use的时候，会调用Store文件中的install方法，并可以获取到当前组件的执行期上下文。通过全局混合的方式，在每个组件上嵌入this.$store属性。
当Store类被实例化时，会执行constructor构造器并且传入option所需的参数，在对state、getters、mutations、actions编写。
1、实现state：理论上讲，直接把参数中的state赋值当前组件上即可，这样会引发一个问题，state的值无法动态改变。要使用state双向绑定可以直接使用vue实例中data方法，然后在通过get进行属性的截取。
2、实现getters：通过Ojbect.defineProperty监听getters值里面的变化，当获取值的时候，会触发get方法，返回并执行参数getters里面的方法。
3、实现mutations：把参数mutations里面的方法重新用一个变量去接收，作用是防止变量的全局污染。定义commit函数，当被执行时，触发定义mutaion对象里面的方法。
4、实现actions：方法同上，有个地方需要作出微调，传递的参数是当前的执行期上下文。
项目案例
了解Vuex4.x 简单实现原理
以上是关于vuex实现原理的主要内容，如果未能解决你的问题，请参考以下文章