Redux(理解版)

146 阅读2分钟

先走一波logo

整体代码是

我们在没有操作数据是,数据是怎样共享并显示页面的? 看下图↓

我们执行顺序是

index页

首先我们先创建了一个最外层(index.js) 用于获取数据并且通过provider吧数据共享到包裹层里
我们执行时首先是引入 react,react-dom,main页,store,以及css和react-redux
执行到ReactDom.render()时我们需要store数据 紧接着我们系统自动调用 ----- store.js

store.js

store.js用于页面和数据之间链接桥梁(不是必须要把combineReducer和Store分开 而是这样走思路比较方便 --- 各司其职)
我首先import了 creatStore 这个有兴趣可以去查查 由于作者自己觉得这不是特别需要理解的所以不再本文中多赘述了
之后引入了 ----- combineReducer
并且把 combineReducer里面的数据塞入我们的creatStore中

CombineReducer.js

在这里我们 首先引用了 redux的 combineReducers 
combineReducers 辅助函数的作用是,把一个由多个不同 reducer 函数作为 valueobject,合并成一个最终的 reducer 函数,
然后就可以对这个 reducer 调用 createStore (简单来说就是把数据很nb的拼起来)
之后获取到我们reducer和reducer2当中的基础数据

当页面执行时 先链接redux 之后获取共享数据 在曝光(export default)处 写个“证明” 这个官方文档有详细说明 有兴趣的去看看 没兴趣的 知道connect (mapStateToProps) (XXX)就可以了

以上就是我们数据是怎么通过redux到页面上的逻辑了(个人觉得写的很简单了,这个要是难理解 深度文章 推荐量力"绕行")


那我们操作值时如何操作的呢 简单~~~一个图概括

都在图里 不是让你找和之前图的不同- -

如果有人有问题 或者说觉得自己这一看都懂 那我到时候再写写(主要是打发时间时候觉得有点烦了)

see you~~~