yarn和npm常用命令
yarn add <package...>
这将安装您的dependencies中的一个或多个包。
yarn add <package...> [--dev/-D]
用 --dev 或 -D 会在 devDependencies 里安装一个或多个包。
npm install 作为 npm 最重要的功能和最常用的功能，不用过多说明，这里只介绍三个非常有用的选项--global，--save，--save-dev。
想必读者肯定知道--global 可以简写成-g，其实另外两个选项也有简写形式，--save 可以简写成-S，--save-dev 可以简写成-D，注意大写。
npm config get registry // 查看npm当前镜像源
npm config set registry https://registry.npm.taobao.org/ // 设置npm镜像源为淘宝镜像
yarn config get registry // 查看yarn当前镜像源
yarn config set registry https://registry.npm.taobao.org/ // 设置yarn镜像源为淘宝镜像
yarn upgrade //升级包
yarn start //启动项目
ES6解构赋值
import React from 'react'
import {Component} from 'react'
等于
import React from 'react'
Const Component = React.Component
前面已经导入了react模块（组件）中的默认组件，并且命名为React
'react'是导出的一个对象也就是React，Component是这个对象的一个属性
React语法
JSX中注释也应写在{}中，会被视为一个标签。
用JSX必须引入React才能编译（看上去好像HTML）
使用组件，组件必须以大写开头，大写就是组件。
在JSX中为避免歧义，用className代替class，用htmlFor代替label标签的for属性，与input标签的id属性对应（扩大点击范围，自动聚焦到输入框）。
给标签绑定事件onclick要写成onClick={func}，
在标记中绑定内联事件响应函数时需要（）而此处不需要。
func在class中定义，数据在class的constructor中的this.state作为对象声明，如果要在方法中访问this.state需要使用bind绑定this，可以在constructor中绑定以提高性能this.handleInputChange = this.handleInputChange.bind(this);
在render方法中使用JSX语法，return类似HTML的代码块，方法和数据都通过{}语法访问，数据必须通过this.state得到，render中return的代码块只能有一个根元素，可以使用 占位标签，需要通过`import { Fragment } from 'react'引入。
dangerouslySetInnerHTML直接写html内容可能被XSS攻击,赋值一个对象{{}},里面用__html:data
通过数组的map方法，在里面的箭头函数里return HTML标签（JSX元素）进行列表渲染
通过this.setState进行视图更新，可以传入一个对象也可以传入一个箭头函数（实现异步），箭头函数接收一个参数prevState是上一次同步的数据，箭头函数返回一个对象。
父组件通过属性向子组件传递值和方法，子组件通过this.props接收，可以通过调用父组件传递的方法传递值和修改父组件的数据（需要在父组件中预先绑定this）。
const { deleteItem,index } = this.props;通过解构赋值取出需要的内容
JS语法
把大括号{放在一行的结尾而不是下一行的开头，因为它会避免在JavaScript的return语句中的一个可怕的设计错误。自动补分号导致返回undefined。
事件响应函数接收一个事件对象e，e.target就是事件对应的DOM元素。
扩展运算符（spread）是三个点（...）。它好比 rest 参数的逆运算，可以使用扩展运算符进行拷贝数组[...array]
rest 参数搭配的变量是一个数组，该变量将多余的参数放入数组中。
箭头函数
如果箭头函数不需要参数或需要多个参数，就使用一个圆括号代表参数部分。
如果箭头函数的代码块部分多于一条语句，就要使用大括号将它们括起来，并且使用return语句返回。
由于大括号被解释为代码块，所以如果箭头函数直接返回一个对象，必须在对象外面加上括号，否则会报错。
return（）无效
return {} 返回一个对象字面量
propTypes和defaultProps进行Typetest和设置接收的props的默认值
TodoItem.propTypes = {
test:PropTypes.string.isRequired,
content: PropTypes.arrayOf(PropTypes.string,PropTypes.number),
deleteItem: PropTypes.func,
index: PropTypes.number
}
TodoItem.defaultProps ={
test:'hello world'
}
