React学习笔记

前段时间因工作需要，快速学习了一下React写了点代码，当时写过一篇初识React的一些感受，但限于时间，没空整理总结。最近搞完了小程序，稍微有点空闲，赶紧来复习总结一下。

参考资料：

• React官网教程

JSX

JSZ是类似const element = <h1>Hello, world!</h1>这样的语法，可以通过花括号{}在其中插入变量或任意JS表达式，如const element = <h1>Hello, {name}!</h1>或const element = <h1>Hello, {formatName(user)}!</h1>。注意，由于JSX相比HTML更接近JavaScript，所以React DOM使用驼峰命名，例如class变为className。

React组件

我们经常用ES6的class来定义一个组件，并且React组件名称总是使用大写字母开头，如：

class Welcome extends React.Component {
   
    render() {
        return <h1>Hello, {
  this.props.name}</h1>;
    }
}

另外要注意几点：

• 可以使用props给组件传入参数，但所有的React组件都必须是纯函数，并禁止修改其自身props；
• 发

常见的React组件结构如下:

class Welcome extends React.Component {
   
    // 构造函数，在里边使用super处理props;
    // 并增加私有状态（state）
    constructor(props) {