React 学习笔记:1-react 入门
接下来的项目里有用到react,最近一段时间主要关注于react 的学习。大部门都是网上的资料,学习整理并记录,加深记忆。
React 是Facebook推出的用来构建用户界面的JavaScript库。具备特性:
不是一个MVC框架,主要用于构建UI, 可以认为是MVC中的V
不适用模板
相应式更新非常简单,具有较高的性能,代码逻辑简单
特点:
1. 声明式设计,采用声明范式,可以轻松描述应用
2. 高效。react通过对DOM的模拟,最大限度的减少与DOM的交互。当DOM树的状态需要发生变化时,虚拟DOM机制会通过一系列高效算法将前后DOM树进行对比,然后React只针对不一样的区域DOM进行响应的修改,从而实现最高效的DOM操作和渲染。如果我们修改了DOM树上一些节点对应绑定的state,React会立即将它标记为“脏状态”,在一个event loop结束时,React会计算得到树上需要修改的地方及他们的最终状态,然后只针对这些地方进行一次性的重新渲染。
3. 灵活。React 可以与已知的库或框架很好的配合
4. JSX。JSX是JavaScript语法的扩展。
5. 组件。指一些可以封装起来、重复使用的UI模块,通过React构建组件可以使代码更容易得到复用,在大的项目中使用很好。
6. 单向相应的数据流。可以减少重复代码,比传统数据绑定更简单
React 学习笔记:1-react 入门的更多相关文章
- React学习笔记一:入门知识概览
一:安装react 1:直接下载react源码包,把需要用到的js文件引入自己的页面即可. 2:BootCDN 的 React CDN 库: 在页面代码中导入即可: <head> < ...
- 【React学习笔记】React生命周期梳理(16.X前后两种)
React生命周期 「16版本以前的:」 生命周期流程图 组件从生成到被挂在到页面上的一系列过程 根据流程图打印的执行顺序图: 流程讲解: 初始化流程 start 开始创建组件 在这个周期中做的事情 ...
- react学习笔记1--基础知识
什么是react A JAVASCRIPT LIBRARY FOR BUILDING USER INTERFACES[React是一个用于构建用户界面的JavaScript库.] React之所以快, ...
- React学习笔记(一)- 入门笔记
React入门指南 作者:狐狸家的鱼 本文链接:React学习笔记 GitHub:sueRimn 1.组件内部状态state的修改 修改组件的每个状态,组件的render()方法都会再次运行.这样就可 ...
- React学习笔记--程序调试
React学习笔记 二 程序调试 前面我们搭建好了React的基本开发环境,可以编写基本的React js程序了.但完成的开发环境肯定包含调试器,怎么调试用React编写的JS程序呢?有浏览器,比 ...
- React学习笔记(七)条件渲染
React学习笔记(七) 六.条件渲染 使用if或条件运算符来创建表示当前状态的元素. 可以使用变量来存储元素.比如: let button = null; if (isLoggedIn) { but ...
- React学习笔记(六)事件处理
React学习笔记(六) 五.事件处理 React事件绑定属性的命名采用驼峰写法,不同于传统DOM全部小写. 如果采用JSX的语法,事件函数需要用大括号{}包裹函数名,不同于传统DOM字符串小括号的方 ...
- React学习笔记(五)State&声明周期
React学习笔记(五) 四.State&声明周期 可以为组件添加"状态(state)".状态与属性相似,但是状态是私有的,完全受控于当前组件. 局部状态就是只能用于类(定 ...
- React学习笔记 - 组件&Props
React Learn Note 4 React学习笔记(四) 标签(空格分隔): React JavaScript 三.组件&Props 组件可以将UI切分成一些独立的.可复用的部件,这样你 ...
随机推荐
- 有关微信小程序
每个页面都要在app.json中配置 "pages": [ "pages/index/index", "pages/list/list", ...
- call,apply,bind
1.IE5之前不支持call和apply,bind是ES5出来的;2.call和apply可以调用函数,改变this,实现继承和借用别的对象的方法; 1 call和apply定义 调用方法,用一个对象 ...
- 使用Selenium爬取网站表格类数据
本文转载自一下网站:Python爬虫(5):Selenium 爬取东方财富网股票财务报表 https://www.makcyun.top/web_scraping_withpython5.html 需 ...
- 爬虫系列(四) 用urllib实现英语翻译
这篇文章我们将以 百度翻译 为例,分析网络请求的过程,然后使用 urllib 编写一个英语翻译的小模块 1.准备工作 首先使用 Chrome 浏览器打开 百度翻译,这里,我们选择 Chrome 浏览器 ...
- Git 基础教程 之 版本回退
不断对文件进行修改,然后不断提交修改到版本库里. 当你觉得文件修改到一定程度时,可以保存一个“快照”,这个“快照”在Git中称为“commit”. 一旦文件被改乱了.误删了,都可以从最近一个“comm ...
- 【ABCD组】Scrum meeting 3
前言 第3次会议在6月15日由组长在教9 405召开. 主要对下一步的工作进行说明安排,时长90min. 主要内容 讨论怎么用c#进行下一步系统的完成 任务分配 姓名 当前阶段任务 贡献时间 下阶段任 ...
- string.Format 格式化日期格式
DateTime dt = DateTime.Now;//2010年10月4日 17点05分 string str = ""; //st ...
- 洛谷 P3178 BZOJ 4034 [HAOI2015]树上操作
题目描述 有一棵点数为 N 的树,以点 1 为根,且树点有边权.然后有 M 个操作,分为三种:操作 1 :把某个节点 x 的点权增加 a .操作 2 :把某个节点 x 为根的子树中所有点的点权都增加 ...
- 执行计划中Using filesort,Using temporary相关语句的优化解决
昨天听开发人员提到,相关的彩票网页当中一个页面刷新的很慢,特别是在提取数据的时候,今天早上一到,便去找开发人员要去相关的也没进行浏览,窥探哪些数据出现了问题,开发人员使用PHP开发,所以我用IE很容易 ...
- ionic3中使用自定义配置
新工作接触了ionic,以前没用过,只是离职前短暂接触过类似的vuex,到需要修改公司项目的时候临时差什么学什么,其中一个是自定义配置项 配置是很常见的设置,之前用的thinkphp的配置很清晰,基本 ...