React定义组件的2种方法

import React, { Component } from 'react';
class Life extends Component {
    constructor(props) {
        super(props);
        //初始化值
        this.state = {
            count: 4
        };
    }

  

    render() {
        var style = {
            padding: '10px',
            color: 'red',
            fontSize: '30px'
        }
        return (
            <div style={style}>{/*注意js语法使用一个括号{}去表示,style使用两个括号,原因里面其实是一个对象*/}
                <p>React生命周期介绍</p>
                <button onClick={this.handleAdd}>无bind点击一下</button>
                <Submit title = {this.state.count}/>
                <button onClick={this.handleClick.bind(this)}>有bind点击一下</button>
                <p>{this.state.count}</p>
            </div>






        )
    }
    //此时this指向是当前实例对象
    handleAdd = () => {
        console.log(this)
        this.setState({
            count: 5
        })
    }
    handleClick() {
        this.setState({
            count: 6
        })
    }
     
   
    
}


export const Submit = (props)=>{

    let count = props.title;
    return(
        <div>
        
        {(count==6) ? (
            <div>飞翔{count}</div>
        ) : null}
        </div>
    )
}

export default Life;