【react】---手动封装一个简易版的redux---【巷子】

weixin_30316097

于 2019-03-05 23:52:00 发布

阅读量95

点赞数

CC 4.0 BY-SA版权

文章标签： javascript ViewUI

原文链接：http://www.cnblogs.com/nanianqiming/p/10480758.html

本文深入解析了Redux的工作原理，包括store的创建、action的分发、reducer的使用以及combineReducers函数的实现细节。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

export let createStore = (reducer)=>{
    //定义默认的state
    let state = {};

    //定义默认的action
    let actionTypes = "@@redux/INIT"+Math.random();
    let initAction = {type:actionTypes}

    //将所以需要监听的函数放在这个里面
    let listeners = []

    //定义getState函数
    let getState = ()=>state;

    //定义事件订阅函数
    let subscribe = (cb)=>{
        listeners.push(cb);
    }

    //定义事件派发函数 用来调用action
    let dispatch = (action=initAction)=>{
       
        //调用reducer获取新的state
        state = reducer(state,action);

        //遍历所以需要监听的函数
        listeners.map((cb)=>{
            cb();
        })
        

    }
    dispatch();

    return {
        getState,
        dispatch,
        subscribe
    }
}