博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
React 学习笔记
阅读量:4839 次
发布时间:2019-06-11

本文共 1105 字,大约阅读时间需要 3 分钟。

1、react 使用JSX语法来描述html,位于花括号的值会被当做一个JavaScript表达式进行求值

2、props是组件的不可变属性,有个重要属性:children,可以使用props.children来引用位于前置标签和后置标签之间的内容

3、state 组件所有可变的属性存储在state中。当state被修改时,组件会触发响应式渲染,组件自身及其子组件都会被重新渲染

4、react中的事件:react为了高效,将事件处理从节点拿出来,统一放在文档根节点进行处理,当事件发生时会将事件映射到对应的组件去渲染。

5、react中的属性采用驼峰式大小写原则(“onClick” 而非"onclick")

6、JSX是react对JavaScript的扩展,用于在js中编写声明式XML风格语法,JSX有一组类似HTML的XML标签,转义后JSX会被转换为针对Reat库的调用。例如

<h1> hello world </h1>
会被转义为

React.createElement("h1", null, "Hello world")

7、JSX与HTML的不同之处:

1) 标签名采取驼峰式命名规范 2)所有元素必须闭合 3)标签名基于DOM api,而不是html语言规范,其中一个例子是class vs className
普通的html:

而JSX却是

8、JSX的特异之处

1)单一根节点
2)不支持if 语句,有类似需求使用三元问号表达式
3)JSX中的注释必须使用花括号({})括起来
4)React内置了XSS攻击保护措施,意味不可以动态动态生成html标签附加到JSX中。如果必须这样做,可以通过dangerouslySetInnerHtml属性来跳过XSS保护

9、react表单内的组件有两种类型:受控组件和非受控组件

1)受控组件:组件的值由外部传入,内部不可以改变组件的值
2)非受控组件:组件不为任何输入域提供值,渲染后的元素值直接反应用户的输入

10、React 虚拟DOM

众所周知,操作DOM是一个耗时操作,为了提高性能,react实现了一个虚拟DOM,用户所有的修改都是直接操作虚拟DOM。为了保持真实DOM和虚拟DOM的一致,需要找出两者之间的最小变化量,这一过程称为子级校验。
1)key属性,再需要进行插入、删除、替换和移动时可以快速找到组件
2)refs属性,如果必须和真实DOM打交道,可以通过refs属性来操作真实DOM

转载于:https://www.cnblogs.com/graph/p/8232449.html

你可能感兴趣的文章
ninth week (1)
查看>>
C float与char数组 互转
查看>>
异步线程中开启定时器
查看>>
正则表达式与unicode
查看>>
abp(net core)+easyui+efcore实现仓储管理系统——ABP总体介绍(一)
查看>>
div水平居中与垂直居中的方法【摘自美浩工作室官方博客 】
查看>>
UITableView 滚动条
查看>>
Android已有的原生Camera框架中加入自己的API的实现方案。
查看>>
Learn python the ninth day
查看>>
Debian+Django+uWsgi+nginx+mysql+celery
查看>>
docker 基本操作
查看>>
无缝滚动的float属性
查看>>
价值观作业
查看>>
char , unsigned char 和 signed char 区别
查看>>
挂起布局逻辑与恢复布局逻辑
查看>>
back to back
查看>>
Linux/Unix笔记本
查看>>
博弈问题之SG函数博弈小结
查看>>
数组排序 --- 庞果
查看>>
Cocos2d-x 处理双击事件的两种方法
查看>>