React学习之组件与props

说明：本系列所有demo代码的github地址为：https://github.com/Brucewu998/react.js-learning，笔者会不断更新这些代码，本篇代码在目录下demo-03文件夹下。

组件

组件允许我们将UI拆分为独立可复用的代码片段，并对每个代码片段进行独立构思，并且React的组件接受任意的入参props，即父组件可以利用props向子组件传值，稍后会再做讲解。在React中，有两种方式可以用于创建组件：

函数组件，就是以JavaScript函数方式创建的组件，形式如下

function Title(props){
    return <h1>{props.title}</h1>
}

ES6 class 组件，这里采用ES6 的 class 语法来创建一个组件，则上面的函数组件创建为：

class Title extends React.Component{
    constructor(props) {
        super(props); //继承React
    }

    render() {
        return <h1>{this.props.Title}</h1>
    }
}

由