React
小星_day
这个作者很懒,什么都没留下…
展开
-
深入浅出React(五):使用Flux搭建React应用程序架构
前面几篇文章介绍了React相关的基本概念和运行原理,可以看到React是一个完全面向View的解决方案,它让我们能以一种新的思路去实现View,让很多复杂的场景可以用一种简单的方法去解决。然而在一个完整的应用程序中,除了实现View之外,我们还需要考虑如何同服务器通信、View之间如何交互以及View背后的数据模型如何去设计。那么Flux正是Facebook提出的解决这些问题的方案。简单转载 2018-01-05 14:51:00 · 867 阅读 · 0 评论 -
深入浅出React(四):虚拟DOM Diff算法解析
React中最神奇的部分莫过于虚拟DOM,以及其高效的Diff算法。这让我们可以无需担心性能问题而”毫无顾忌”的随时“刷新”整个页面,由虚拟DOM来确保只对界面上真正变化的部分进行实际的DOM操作。React在这一部分已经做到足够透明,在实际开发中我们基本无需关心虚拟DOM是如何运作的。然而,作为有态度的程序员,我们总是对技术背后的原理充满着好奇。理解其运行机制不仅有助于更好的理解React组件的转载 2018-01-05 14:50:22 · 582 阅读 · 0 评论 -
深入浅出React(三):理解JSX和组件
通过前两篇文章的介绍,相信大家对JSX和组件已经有了一定的了解。JSX这种混合使用JavaScript和XML的语言第一眼看上去很“丑”,也很神奇,但是其语法和背后的逻辑却极其简单。相信读完本文你就可以对JSX和组件有一个全面的了解,并能够用JSX来直观的构造用户界面。什么是JSXReact的核心机制之一就是虚拟DOM:可以在内存中创建的虚拟DOM元素。React利用虚拟DOM来减转载 2018-01-05 14:49:37 · 348 阅读 · 0 评论 -
深入浅出React(二):React开发神器Webpack
上一篇我们对React有了一个总体的认识,在介绍其中的技术细节之前,我们首先来了解一下用于React开发和模块管理的主流工具Webpack。称之为React开发神器有点标题党了,不过Webpack确实是笔者见过的功能最为强大的前端模块管理和打包工具。虽然Webpack是一个通用的工具,并不只适合于React,但是很多React的文章或者项目都使用了Webpack,尤其是react-hot-load转载 2018-01-05 14:48:50 · 334 阅读 · 0 评论 -
深入浅出React(一):React的设计哲学 - 简单之美
自2013年Facebook发布以来,React吸引了越来越多的开发者,基于它的衍生技术,如React Native、React Canvas等也层出不穷。InfoQ精心策划“深入浅出React”系列文章,为读者剖析React开发的技术细节。React最初来自Facebook内部的广告系统项目,项目实施过程中前端开发遇到了巨大挑战,代码变得越来越臃肿且混乱不堪,难以维护。于是痛定思痛,他们转载 2018-01-05 14:47:54 · 308 阅读 · 0 评论 -
React常见的一些坑
1、setState()是异步的this.setState()会调用render方法,但并不会立即改变state的值,state是在render方法中赋值的。所以执行this.setState()后立即获取state的值是不变的。同样的直接赋值state并不会出发更新,因为没有调用render函数。2、组件的生命周期componentWillMount,componentDidMo原创 2017-03-29 14:26:19 · 3907 阅读 · 1 评论 -
React整体流程
文章地址:http://react-china.org/t/react-redux/9072react的组件化react的一个组件很明显的由dom视图和state数据组成,两个部分泾渭分明。state是数据中心,它的状态决定着视图的状态。这时候发现似乎和我们一直推崇的MVC开发模式有点区别,没了Controller控制器,那用户交互怎么处理,数据变化谁来管理?然而这转载 2017-03-29 14:24:50 · 18215 阅读 · 2 评论 -
React生命周期
在组件的整个生命周期中,随着该组件的props或者state发生改变,其DOM表现也会有相应的变化。一个组件就是一个状态机,对于特定地输入,它总返回一致的输出。一个React组件的生命周期分为三个部分:实例化、存在期和销毁时。实例化当组件在客户端被实例化,第一次被创建时,以下方法依次被调用:1、getDefaultProps2、getInitialState转载 2017-03-27 16:40:16 · 382 阅读 · 0 评论 -
React和Redux的连接react-redux
http://leozdgao.me/reacthe-reduxde-qiao-jie-react-redux/之前一直在探索React相关的东西,手上有个SPA项目,于是准备上Redux试试水。Redux本身和React并没有之间的关联,它是一个通用Javscript App模块,用做App State的管理。要在React的项目中使用Redux,比较好的方式是借助react-redux这个转载 2016-06-09 14:32:57 · 716 阅读 · 0 评论 -
React 组件之间如何交流
前言今天群里面有很多都在问关于 React 组件之间是如何通信的问题,之前自己写的时候也遇到过这类问题。下面是我看到的一篇不错英文版的翻译,看过我博客的人都知道,我翻译可能不会按部就班,会尽可能用中文的意思,来将作者要讲述的技术描述清楚。英文能力有限,如果有不对的地方请跟我留言,一定修改……^_^原著序处理 React 组件之间的交流方式,主要取决于组件之间的关系,然而这些转载 2016-06-04 10:16:04 · 11371 阅读 · 0 评论 -
Immutable 详解及 React 中实践
作者:camsong链接:https://zhuanlan.zhihu.com/p/20295971来源:知乎著作权归作者所有。商业转载请联系作者获得授权,非商业转载请注明出处。有人说 Immutable 可以给 React 应用带来数十倍的提升,也有人说 Immutable 的引入是近期 JavaScript 中伟大的发明,因为同期 React 太火,它的光芒被掩盖了。这些至转载 2016-06-01 16:49:47 · 1082 阅读 · 0 评论 -
react middleware
前言react已经出来很久了,其生态圈之庞大,一锅炖不下!各种react-xx,已让我们不堪重负,github上随便一个demo,引入的模块至少都是五指之数+。看着头疼,嚼之无味……。在此建议新学者,可以从基础的核心模块学起,前期不要考虑那些数量繁多的马仔小弟,边学边写,个人感觉前期核心要学的流程大致如下:React ——> React + redux + React-redux ——>...转载 2018-03-15 16:39:59 · 1512 阅读 · 0 评论