zoukankan      html  css  js  c++  java
  • 浅读vuex源码,了解vuex基本原理

    极简版vuex代码

    class KVuex {
        constructor (options) {
            this.state = options.state
            this.mutations = options.mutations
            this.actions = options.actions
            // 借用vue本身的响应式的通知机制
            // state 会将需要的依赖收集在 Dep 中
            this._vm = new KVue({
                data: {
                    $state: this.state
                }
            })
        }
    
        commit (type, payload, _options) {
            const entry = this.mutations[type]
            entry.forEach(handler=>handler(payload))
        }
    
        dispatch (type, payload) {
            const entry = this.actions[type]
    
            return entry(payload)
        }
    }

          构造函数constructor接受options参数,options参数传进来之后,作为成员属性保存下来。vuex是依赖vue的, 借用vue本身的响应式的通知机制,constructor里声明一个vue实例,把vuex里的state赋值给实例中的data, 从而实现响应式动态变化。

        我们做提交改数据又是什么行为呢?commit有3个参数type payload _options,我们从mutations里取出type对应的函数,对它进行具体的操作(传入参数执行函数)

        Dispatch与commit类似,接受2个参数type payload ,从actions里取出type对应的函数,对它进行具体的操作(传入参数执行函数)

  • 相关阅读:
    二叉查找树
    二叉树
    广度优先搜索
    深度优先搜索
    algorithm:next_permutation
    Grafana Labs 携手阿里云,将提供国内首款 Grafana 托管服务
    台积电TSMC一些技术特点
    TSMC台积电各种制程工艺技术
    激光雷达激烈竞争市场
    边端云处理器系列技术参数
  • 原文地址:https://www.cnblogs.com/superlizhao/p/10985975.html
Copyright © 2011-2022 走看看