react 点赞

import React from 'react';
class Likes extends React.Component{
    constructor(props){
        super(props)
        this.state = {
            likes: 0
        }
        // this.increaseLikes = this.increaseLikes.bind(this)
    }
    increaseLikes(){
        this.setState({
            likes: ++this.state.likes
        })
    }
    render(){
        return(
            <div>
                <button className="btn btn-outline-promary btn-lg"
                onClick={()=>{this.increaseLikes()}}
                >
                    赞{this.state.likes}
                </button>
            </div>
        )
    }
}
export default Likes;

事件使用驼峰式 不可为全小写

事件中设置this的问题：

直接绑定事件后，事件中this为undefined，需要在constructor中绑定：

this.increaseLikes = this.increaseLikes.bind(this)

或者在绑定事件的时候写成：

onClick={()=>{this.increaseLikes()}}

两种方法都可以解决这个问题

修改state中的数据必须通过 this.setState()方法修改