学习@胡子大哈的教程写评论框,做了一些自己需要注意的笔记
附,胡子大哈的教程:http://huziketang.com/books/react/lesson1
1、必须要用一个外层的 JSX 元素把所有内容包裹起来。返回并列多个 JSX 元素是不合法的
2、事件名称都必须要用驼峰命名法。
3、this.setState是异步进行的,如需要拿state进行计算则参考实例
handleClickOnLikeButton () {
this.setState((prevState) => {
return { count: 0 }
})
this.setState((prevState) => {
return { count: prevState.count + 1 } // 上一个 setState 的返回是 count 为 0,当前返回 1
})
this.setState((prevState) => {
return { count: prevState.count + 2 } // 上一个 setState 的返回是 count 为 1,当前返回 3
})
// 最后的结果是 this.state.count 为 3
}
4、如果一个文件导出的是一个类,那么这个文件名就用大写开头。
5、生命周期
-> constructor()
-> componentWillMount() Ajax 数据的拉取操作、一些定时器的启动等,就可以放在 componentWillMount
-> render()
// 然后构造 DOM 元素插入页面
-> componentDidMount()
// ...
// 即将从页面中删除
-> componentWillUnmount()
// 从页面中删除
6、定时器写在组件内要在组件unmount的时候清除
7、componentWillUpdate里面不能使用setdata,会造成死循环
8、组件的内容编写顺序如下:
static 开头的类属性,如 defaultProps、propTypes。
构造函数,constructor。
getter/setter(还不了解的同学可以暂时忽略)。
组件生命周期。
_ 开头的私有方法。
事件监听方法,handle*。
render*开头的方法,有时候 render() 方法里面的内容会分开到不同函数里面进行,这些函数都以 render* 开头。
render() 方法。