随笔分类 -  React

Redux进阶(Redux背后的Flux)
摘要:简介 Flux是一种搭建WEB客户端的应用架构,更像是一种模式而不是一个框架。 特点 单向数据流 与MVC的比较 1.传统的MVC如下所示(是一个双向数据流模型) 用户触发事件 View通知Controller执行相关逻辑 Controller通知Modal需要数据 Modal返回数据给Contro 阅读全文

posted @ 2019-01-21 14:49 菜的黑人牙膏 阅读(200) 评论(0) 推荐(0)

Redux进阶(像VUEX一样使用Redux)
摘要:"更好的阅度体验" 前言 redux的问题 方案目标 如何实现 思考 前言 Redux是一个非常实用的状态管理库,对于大多数使用React库的开发者来说,Redux都是会接触到的。在使用Redux享受其带来的便利的同时, 我们也深受其问题的困扰。 redux的问题 之前在 "另外一篇文章Redux基 阅读全文

posted @ 2019-01-14 14:28 菜的黑人牙膏 阅读(1540) 评论(0) 推荐(0)

React-router杂记
摘要:1. HashRouter: 即对应url中的hash值,如xx.com/ /a、xx.com/ /a/b, 服务器对任务url都返回同一个url,具体的路径由浏览器区分,因为浏览器不会发送hash后面的值给服务器。 2. BrowserRouter:如果是BrowseRouter即url变成这样, 阅读全文

posted @ 2018-12-28 10:07 菜的黑人牙膏 阅读(109) 评论(0) 推荐(0)

Redux进阶(Immutable.js)
摘要:更好的阅读体验 更好的阅度体验 Immutable.js Immutable的优势 Immutable的问题 原生Js遇到的问题 原生Js遇到的问题 由于Js中的对象是引用类型的,所以很多时候我们并不知道我们的对象在哪里被操作了什么,而在Redux中,因为Reducer是一个纯函数,每次返回的都是一 阅读全文

posted @ 2018-12-21 16:22 菜的黑人牙膏 阅读(774) 评论(1) 推荐(0)

Redux,基础
摘要:在学习了React之后, 紧跟着而来的就是Redux了~ 在系统性的学习一个东西的时候, 了解其背景、设计以及解决了什么问题都是非常必要的。 接下来记录的是, 我个人在学习Redux时的一些杂七杂八~ Redux是什么? 通俗理解 https://www.zhihu.com/question/413 阅读全文

posted @ 2018-12-19 19:49 菜的黑人牙膏 阅读(496) 评论(1) 推荐(0)

React生命周期
摘要:自从React发布Fiber之后,更新速度日新月异,而生命周期也随之改变,虽然原有的一些生命周期函数面临废弃,但理解其背后更新的机制也是一种学习 在这里根据官方文档以及社区上其他优秀的文章进行一个对于生命周期的总结,大致上分为以下三个模块 新老生命周期的区别 新的生命周期增加了static getD 阅读全文

posted @ 2018-12-02 17:31 菜的黑人牙膏 阅读(693) 评论(0) 推荐(0)

React事件杂记及源码分析
摘要:前提 最近通过阅读React官方文档的事件模块,发现了其主要提到了以下三个点 带着问题,通过查询资料和源码来探寻~ 1.调用方法时需要手动绑定this 先从一段官方代码看起: 代码中的注释提到了一句话: This binding is necessary to make `this` work in 阅读全文

posted @ 2018-11-29 20:11 菜的黑人牙膏 阅读(514) 评论(0) 推荐(0)

关于setState的一些记录
摘要:在看React的官方文档的时候, 发现了这么一句话,State Updates May Be Asynchronous,于是查询了一波相关的资料, 最后归纳成以下3个问题 常见场景下的异步更新 以下是官方文档的一个例子, 调用了3次incrementCount方法, 期望this.state.cou 阅读全文

posted @ 2018-11-19 21:11 菜的黑人牙膏 阅读(293) 评论(0) 推荐(0)

React Fiber源码分析 (介绍)
摘要:写了分析源码的文章后, 总觉得缺少了什么, 在这里补一个整体的总结,输出个人的理解~ 文章的系列标题为Fiber源码分析, 那么什么是Fiber,官方给出的解释是: React Fiber是对核心算法的一次重新实现。 ummm, 这样说实在是有点泛,详细分析一下 先从开发者角度来看 实际上这次更新对 阅读全文

posted @ 2018-11-11 10:44 菜的黑人牙膏 阅读(2163) 评论(0) 推荐(0)

React Fiber源码分析 第三篇(异步状态)
摘要:先附上流程图~ 调用setState时, 会调用classComponentUpdater的enqueueSetState方法, 同时将新的state作为payload参数传进 enqueueSetState会先调用requestCurrentTime获取一个currentTime, 通过获取到的c 阅读全文

posted @ 2018-11-10 11:47 菜的黑人牙膏 阅读(1479) 评论(0) 推荐(1)

React Fiber源码分析 第二篇(同步模式)
摘要:先附上两张流程图 1.scheduleRootUpdate 这个函数主要执行了两个操作 1个是创建更新createUpdate并放到更新队列enqueueUpdate, 1个是执行sheculeWork函数 先从createUpdate函数分析, 他直接返回了一个包含了更新信息的对象 接着更新pay 阅读全文

posted @ 2018-11-08 21:44 菜的黑人牙膏 阅读(1111) 评论(0) 推荐(0)

React Fiber源码分析 第一篇
摘要:先附上流程图一张 先由babel编译, 调用reactDOM.render,入参为element, container, callback, 打印出来可以看到element,container,callback分别代表着react元素、DOM原生元素,回调函数 render实际上调用的是 legac 阅读全文

posted @ 2018-11-06 20:55 菜的黑人牙膏 阅读(1593) 评论(0) 推荐(0)

导航