React
那等雨停吧
愿你有梦可依,有树可栖。
展开
-
从源码角度理解Redux中间件---applyMiddleware
什么是中间件在redux中,我们可以在view层dispatch一个action,action到达store中的reducer,reducer根据action的type更新处理state,从而更新store中的数据。但是redux并不能处理异步的dispatch。这时候我们就需要使用redux提供的applyMiddleware对dispatch进行增强,使我们的dispatch可以异步。这里...原创 2020-03-24 11:04:19 · 300 阅读 · 0 评论 -
浅谈React16与Vue3
前言最近对React16的新特性还有其更新机制进行了略有系统的学习,同时也观看了尤玉溪在Vue-Conf上的演讲,受益匪浅,记录一下感想。React与Vue都采用了Virtual Dom的思想进行页面的更新,但是React是基于JSX语法进行开发,而Vue基于模板编译。v-dom的使用,并不是因为v-dom可以提升渲染性能,实际上,在Diff Tree的过程中,消耗的性能未必比重排重绘少。v-...原创 2020-03-16 17:51:44 · 2454 阅读 · 0 评论 -
React源码16.12.x --- Component 与 PureComponent
如何区分纯组件React PureComponent 源码解析Component & PureComponent这两个类基本相同,唯一的区别是PureComponent的原型上多了一个标识。这是检查组件是否需要更新的一个判断,ctor就是你声明的继承自Component or PureComponent的类,他会判断你是否继承自PureComponent,如果是的话就shallow...原创 2020-03-14 22:12:30 · 326 阅读 · 1 评论 -
React实战 ---- 路由配置及多级导航切换路由
在管理系统这类项目中,比较常见的设计还是这样的。404页面,宣传主页,登录页面,注册页面,找回密码页面单独处理。而系统内部就需要统一管理了,不仅仅要管理用户信息token的有效性,为了良好的用户体验,我们还有需要使用二级路由。老规矩,先上源码Liz606/webpack-es6-react讲解在这里:手把手带你搭建与配置Webpack + ES6 + React开发环境这时我们就需要...原创 2019-12-23 18:51:34 · 1068 阅读 · 0 评论 -
React+Router多级导航切换路由
背景我们需要开发一个管理平台,登陆、注册及网站首页等不需要加载用户信息的页面放置在系统外部,系统内部则是需要验证用户身份及其角色的页面。文件结构注:输出文件树及文件 tree ./src /F│ index.html 页面文件入口│ index.js js文件入口│ style.scss├─actions│ api.js│ base.js├─conta...原创 2019-11-08 13:30:19 · 1271 阅读 · 0 评论 -
手把手带你搭建与配置Webpack + ES6 + React开发环境
初始化项目npm init -yes// 默认跳过所有需要选择的条目安装webpacknpm install --sava-dev webpack如果想使用webpack4+版本,还需安装webpack-clinpm install --save-dev webpack-cliwebpack配置项解读mode: 告诉webpack开发模式,'production’则会压缩代码...原创 2019-10-20 18:26:29 · 227 阅读 · 0 评论 -
React特点:JSX、虚拟Dom、声明式(组件化)
虚拟Dom首先来了解下真实的Dom,是渲染到页面上的真实节点。真实Dom是由浏览器提供的,我们可以使用浏览器提供的API去操作这些节点。而虚拟Dom是由开发者实现的,将页面节点存储为一颗虚拟Dom树,但因为没有渲染到页面上,因此并不能使用浏览器提供的API去操作节点。当真实Dom被修改,将被重新刷新加载。如果是修改一棵庞大的Dom树的小节点而造成页面重新计算、重绘的代价是非常大的,因此Reac...原创 2019-10-14 10:14:29 · 434 阅读 · 0 评论