react 入门
一:virtual DOM 虚拟DOM树
在React中,render执行的结果得到的并不是真正的DOM节点,结果仅仅是轻量级的JavaScript对象,我们称之为virtual DOM。
虚拟DOM是React的一大亮点,具有batching(批处理)和高效的Diff算法。这让我们可以无需担心性能问题而”毫无顾忌”的随时“刷新”整个页面,由虚拟 DOM来确保只对界面上真正变化的部分进行实际的DOM操作。
二:组件化开发
1.自定义标签
2.高内聚的资源
3.独立的作用域
4.规范化的接口
组件化开发的特点
1.可组合
2.可重用
3.可维护
4.可测试
三:jsx 语法
允许HTML 和 javaScript 混写。
语法规则:遇到 < 括号,就用 html 语法解析,遇到 { 就用 javaScript 语法解析。
四:单项数据流
- 首先要有 action,通过定义一些 action creator 方法根据需要创建 Action 提供给 dispatcher
- View 层通过用户交互(比如 onClick)会触发 Action
- Dispatcher 会分发触发的 Action 给所有注册的 Store 的回调函数
- Store 回调函数根据接收的 Action 更新自身数据之后会触发一个 change 事件通知 View 数据更改了
- View 会监听这个 change 事件,拿到对应的新数据并调用 setState 更新组件 UI
单项数据流框架 1. Flux
网址: https://hulufei.gitbooks.io/react-tutorial/content/flux.html
2.Redux
中文文档: http://camsong.github.io/redux-in-chinese/index.html
react 入门的更多相关文章
- react入门(3)
在第一篇文章里我们介绍了jsx.组件.css写法 点击查看react入门(1) 第二篇文章里我们介绍了事件.this.props.children.props....other.map循环 点击查 ...
- react入门(1)
这篇文章也不能算教程咯,就算是自己学习整理的笔记把. 关于react一些相关的简介.优势之类的,随便百度一下一大堆,我就不多说了,可以去官网(http://reactjs.cn/)看一下. 这片主要讲 ...
- react入门(2)
接着上一次的讲,如果没有看过上一篇文章的小伙伴可以先看一下http://www.cnblogs.com/sakurayeah/p/5807821.html React事件 可以先看一下官网讲解的内容h ...
- react入门(4)
首先还是来回顾一下前三篇讲的内容 react入门(1): jsx,组件,css写法 react入门(2):事件,this.props.children,props,...other react入门(3 ...
- React 入门实例教程(转载)
本人转载自: React 入门实例教程
- React 入门实例教程
现在最热门的前端框架,毫无疑问是 React . 上周,基于 React 的 React Native 发布,结果一天之内,就获得了 5000 颗星,受瞩目程度可见一斑. React 起源于 Face ...
- React入门 (1)—使用指南(包括ES5和ES6对比)
前言 本篇会简明扼要的介绍一下React的使用方法.代码会用JSX+ES5和JSX+ES6两种方式实现. React简介 React来自Facebook,于2013年开源.至今不断修改完善,现在已经到 ...
- React入门简单实践
参考文献: 1.React入门示例教程——阮一峰 2.React仅仅只是你的界限 React主要的优点就是增量更新(虚拟DOM)和组件化(状态机). <!DOCTYPE html> < ...
- 2015年最热门前端框架React 入门实例教程
现在最热门的前端框架,毫无疑问是 React . 上周,基于 React 的 React Native 发布,结果一天之内,就获得了 5000 颗星,受瞩目程度可见一斑. React 起源于 Face ...
- React入门资源整理
另外,附上我搜集的一些比较实用的学习资料,建议先看这些撸起来,再看什么乱七八糟的awsome系列. React入门资源整理 React项目新手指南 http://www.w3ctech.com/top ...
随机推荐
- 浅谈Vue不同场景下组件间的数据交流
浅谈Vue不同场景下组件间的数据“交流” Vue的官方文档可以说是很详细了.在我看来,它和react等其他框架文档一样,讲述的方式的更多的是“方法论”,而不是“场景论”,这也就导致了:我们在阅读完 ...
- POJ 2386 Lake Counting (简单深搜)
Description Due to recent rains, water has pooled in various places in Farmer John's field, which is ...
- Ubuntu 16.04 LTS安装 TeamViewer
Ubuntu 16.04 LTS安装 TeamViewer 64位Ubuntu 16.04系统需要添加32位架构支持,命令如下. sudo dpkg --add-architecture i3 ...
- Given two binary string, return their sum (also a binary string)
主要思路:将二进制转化为十进制,然后进行十进制加法,最后再将加法所得的结果转化为二进制 public class BinarySum2 { public static void main(String ...
- 用户单独管理Jenkins的某些项目
管理用户: 建立用户: 安装Role-Based Strategy插件 安装插件后,进入系统设置页面,配置如下: 在系统管理页面点击Manage and Assign Roles进入角色管理页面: 1 ...
- python3.6----datetime.timedelta
学习利用python进行数据分析---时间序列分析的时候发现python2.7版本的timedelta模块跟python3.6模块区别python2.7:in:delta= datetime(2017 ...
- 70. Climbing Stairs【leetcode】递归,动态规划,java,算法
You are climbing a stair case. It takes n steps to reach to the top. Each time you can either climb ...
- Dom的增删查改以及常用事件
dom的增删查改 // 查 var _input = document.getElementById('_input'); var _div = document.getElementsByClass ...
- Markdown的简单用法
Markdown 是一种用来写作的轻量级标记语言,它用简洁的语法代替排版,而不像一般我们用的字处理软件 Word 或 Pages 有大量的排版.字体设置.它使我们专心于码字,用「标记」语法,来代替常见 ...
- 曲线点抽稀算法-Python实现
何为抽稀 在处理矢量化数据时,记录中往往会有很多重复数据,对进一步数据处理带来诸多不便.多余的数据一方面浪费了较多的存储空间,另一方面造成所要表达的图形不光滑或不符合标准.因此要通过某种规则,在保证矢 ...