React基础知识点全解
• propTypes、defaultProps 作为 properties 定义,也可以在组件外部通过键值对方式进行设置。
• 设置组件初始的 state不支持 getInitialState,可以在组件的constructor中通过this.state来设置,直接作为 properties 定义也可以。
• 不支持 mixins,可以使用高阶组件写法,或者 decorator。
1. 顶层API
最简单的React组件及渲染
react.js
Component API
react-dom.js
react-dom-server.js
2. jsx语法
类似 xml 的语法,用来描述组件树
不用JSX,用React提供的API写的话
2.1 注释、命名、根元素个数、JSX 嵌入变量
- React只有一个限制, 组件只能渲染单个根节点。如果你想要返回多个节点,它们必须被包含在同一个节点里。
2.2 styles
2.3 JSX SPREAD
可以用通过 {...obj} 来批量设置一个对象的键值对到组件的属性,注意顺序
2.4 属性名不能和 js 关键字冲突
例如:className, readOnly, htmlfor
3. 数据流:state props propType
3.1 state && setState
用状态控制组件变化 可以把一个组件看做一个状态机, 每一次状态对应于组件的一个 ui
组件内部的状态,可以使用 state
3.2 props
通过 this.props 可以获取传递给该组件的属性值,还可以通过定义 getDefaultProps 来指定默认属性值(这是ES5的写法,ES6定义组件的默认props可以直接写props)
下面几个是props的常用API:
• this.props.children
• this.props.map
• this.props.filter
props是调用组件的时候传递进去的数据,一般用于组件树数据传递
3.3 propTypes
通过指定 propTypes 可以校验props属性值的类型,校验可提升开发者体验,用于约定统一的接口规范。
React基础知识点全解的更多相关文章
- [转载] Python数据类型知识点全解
[转载] Python数据类型知识点全解 1.字符串 字符串常用功能 name = 'derek' print(name.capitalize()) #首字母大写 Derek print(name.c ...
- c# 实用精华知识点全解
本文介绍c#的实用知识点 写在前面(通识) vs常用快捷键 F5 调试运行程序 ctrl F5 不调试运行程序 F11 逐条语句调试 F10 逐过程调试程序 注释快捷键 ctrl + k + c 代码 ...
- js面试题知识点全解(一变量类型和计算)
1.js中使用typeof能得到哪些类型 2.何时使用===和== 3.js中的内置函数 4.js变量按存储方式区分为哪些类型,并描述其特点 5.如何理解json 以下对这些问题的知识点做一些总结: ...
- js面试题知识点全解(一原型和原型链1)
1.如何准确判断一个变量是数组类型2.写一个原型链继承的例子3.描述new一个对象的过程4.zepto(或其他框架)源码中如何使用原型链知识点:1.构造函数2.构造函数-扩展3.原型规则和示例4.原型 ...
- js面试题知识点全解(一作用域和闭包)
问题: 1.说一下对变量提升的理解 2.说明this几种不同的使用场景 3.如何理解作用域 4.实际开发中闭包的应用 知识点: js没有块级作用域只有函数和全局作用域,如下代码: if(true){ ...
- js面试题知识点全解(一作用域)
问题: 1.说一下对变量提升的理解 2.说明this几种不同的使用场景 3.如何理解作用域 4.实际开发中闭包的应用 知识点: js没有块级作用域只有函数和全局作用域,如下代码: if(true){ ...
- js面试题知识点全解(一原型和原型链)
1.如何准确判断一个变量是数组类型2.写一个原型链继承的例子3.描述new一个对象的过程4.zepto(或其他框架)源码中如何使用原型链知识点:1.构造函数2.构造函数-扩展3.原型规则和示例4.原型 ...
- js面试题知识点全解(一闭包)
闭包使用场景:1.函数作为返回值,如下场景 function F1(){ var a = 100 //自由变量 //返回一个函数(函数作为返回值) return function(){ console ...
- Java并发基础知识点详解
1.synchronized与Lock区别 父类有synchtonized,子类调用父类的同步方法,是没办法同步的,因为synchronized不是修饰符,不会被继承下来. synchronized ...
随机推荐
- [LeetCode] 347. 前K个高频元素
python 版方法1:链表 class Solution(object): def topKFrequent(self, nums, k): """ :type num ...
- 可序列化serializable的作用是什么
什么情况下需要序列化:a)当你想把的内存中的对象写入到硬盘的时候:b)当你想用套接字在网络上传送对象的时候: 为什么要序列化: 为了将对象可以以流的方式传输到其他位置,就必须要将该对象定义为可序列化的 ...
- hadoop的理解
知乎上有个人写的感觉挺好理解的,不知道对不对,先截图存着
- rabbitMQ学习笔记(六) topic类型消息。
上一节中使用了消息路由,消费者可以选择性的接收消息. 但是这样还是不够灵活. 比如某个消费者要订阅娱乐新闻消息 . 包括新浪.网易.腾讯的娱乐新闻.那么消费者就需要绑定三次,分别绑定这三个网站的消息类 ...
- https 证书 certbot-auto执行错误
报错:ImportError: /root/.local/share/letsencrypt/lib/python2.7/site-packages/cryptography/hazmat/bindi ...
- C# 用ManulResetEvent 控制Thread的 Suspend、Resume
class Program { static void Main(string[] args) { Thread thread = new Thread(Work); thread.Start(); ...
- UI设计师不可不知的安卓屏幕知识-安卓100分享
http://www.android100.org/html/201505/24/149342.html UI设计师不可不知的安卓屏幕知识-安卓100分享 不少设计师和工程师都被安卓设备纷繁的屏幕搞得 ...
- iOS 权限判断 跳转对应设置界面
相机权限 1.1 使用说明 在合适的地方导入#import <AVFoundation/AVFoundation.h> 使用AVAuthorizationStatus类获取当前权限状态 在 ...
- php利用反射真正实现多继承(非接口模拟)
昨天我在写PHP程序的时候,无意发现在PHP的::操作符非常强大,不仅仅是只用在访问parent,sel,静态成员属性.常量上面,其实他的功能强大了去了 . 这个符号在PHP中实际上叫做范围解析符,这 ...
- BZOJ 2733 线段树的合并 并查集
思路: 1.线段树合并(nlogn的) 2.splay+启发式合并 线段树合并比较好写 我手懒 //By SiriusRen #include <cstdio> #include < ...