[JavaScript知识库]react类组件和函数组件区别

函数组件只适用于较简单的组件，举个例子

     function Demo(){
            return <h1>只能是功能较简单的组件</h1>
        }
        ReactDOM.render(<Demo/>,document.getElementById('test'))

函数组件，没有类似vue中的 data，能实现数据驱动页面的功能，而类组件可以
举个例子

	class Weather extends React.Component {
				constructor(props) {
					super(props)
					this.state = {
						isHot: true,
						windy: '微风'
					}
					this.demo = this.demo.bind(this)
				}
				demo() {
					this.setState({
						isHot: !this.state.isHot
					})
				}
				render() {
					return (
						<div>
							<h1 onClick={this.demo}>
								今天天气很{this.state.isHot ? '炎热' : '寒冷'}
								<p>{this.state.windy}</p>
							</h1>
						</div>
					)
				}
			}
			ReactDOM.render(<Weather />, document.getElementById('test'))

因为函数组件没有实例对象，没有state属性，类似vue的data，所以在功能复杂的页面上，用类定义组件会更合适