react中使用 setState 修改数据

import React, { Component } from 'react'

export default class Like extends Component {
  constructor() { 
    super();
    this.state = {
      isLike: false,
      isLike2: false,
    }
  }
  // 点击事件
  handleLikeBtn = () => {
    //  react 里修改数据用setState 方法，该方法可以有两个参数，第一个参数有两种情况：
    // 当第一个参数是对象时：
    this.setState({
      isLike: !this.state.isLike
    })
    // 当第一个参数是方法时,
    this.setState((preState, props) => {
      // 可以在第一个方法中获取之前的数据和props数据
      return {
        isLike2: !preState.isLike2
      }
    }, () => {
      // setState是异步的，可以在第二个方法中得到最新的数据
      console.log(this.state.isLike2 );
    })
  }
  render() {
    return (
      <div>
        <span style={{ fontSize: '36px', cursor: 'pointer' }}
          onClick={this.handleLikeBtn} >
           { this.state.isLike ? '取消 ❤️' : '喜欢 💙' }
           { this.state.isLike2 ? '取消 😁' : '喜欢 🤪' }
        </span>
        
      </div>
    )
  }
}

 <Like name="茄子"></Like>

效果：