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 ...
随机推荐
- 双向循环链表(C语言描述)(二)
链表的基本操作基于对链表的遍历:计算链表的长度就是对链表进行一次遍历: int linkedlist_length(const LinkedList list) { assert(list); ; L ...
- vue指令v-html示例解析
更新元素的innerHTML,不会作为vue模板编译,可用组件来代替. 在网站上动态渲染任意 HTML 是非常危险的,因为容易导致 xss攻击.只在可信内容上使用 v-html,永不用在用户提交的内容 ...
- 今天出现了一个问题,Tomcat 进入localhost:8080正常,进入项目内别的页面都是空白页
经仔细检查发现代码没有任何的问题,经仔细检查找到了原因. 问题原因:拦截器(过滤器)把我的访问请求全都拦下了,我在拦截器里把//chain.doFilter(request, response);这行 ...
- ETL作业调度工具TASKCTL的两个重大突破
在传统设计理念下,流程图的可视化.作业流的定义设计功能,随着作业量增加,越来越难用,越来越不适用是一个难以避免的问题.就这两个问题,我给大家分享一下TASKCTL是如何转变思路.如何突破.如何带来一些 ...
- Markdown转HTML/pdf格式
Markdown转HTML/pdf格式 通过_github自带_的更新博客的网页: https://github.com/YOUR_GITHUB_ACCOUNT/YOUR_GITHUB_ACCOUNT ...
- 有返回值的函数,如果包含try/catch块,经常会出现没有return的错误
public static Connection getConnection(){ try { return datasource.getConnection(); } catch (SQLExcep ...
- Python 使用一等函数实现设计模式
案例分析:重构"策略"模式 p.p1 { margin: 0.0px 0.0px 0.0px 0.0px; font: 15.0px Helvetica } 如果合理利用作为一等对 ...
- SLF4J源码解析-LoggerFactory(二)
承接前文SLF4J源码解析-LoggerFactory(一),本文则主要针对获取ILoggerFactory对象作下简单的分析 LoggerFactory#getILoggerFactory() 源码 ...
- vim 基本编辑操作
一.光标跳转到指定行 1.在命令模式下,跳转到指定行 :n (n为行号) 2.命令行加参数 vim +n fileName 3.命令行加参数 vim + fileName 光标移至文件底部 4. ...
- EclipseIDE--使用整理
EclipseIDE--使用整理.. ---------------- /--------------------习惯上的字体使用,华文中宋GeorgiaCambria华文中宋/----------- ...