React 常用的钩子函数

useState

import { Button } from 'antd'
import React, { useState } from 'react'

function lottery() {
  const [x, setX] = useState(0)
  const [y, setY] = useState(() => {
    if (x > 0) {
      return 1
    } else {
      return 2
    }
  })

  const onClick = () => {
    setX(x + 1)
    // 通过回调可以拿到最新值
    setX((pre) => {
      console.log(pre)
      return pre
    })
    console.log(x, 1) // 0 异步
  }

  const onClick2 = () => {
    setX(x + 1)
    setX(x + 1)
    setX(x + 1)
    setX(x + 1)
    setX(x + 1) // 相同方法 连续执行多次只有最后一次生效
    setY(y + 1) // 不同的方法会合并称为一次执行
  }
  return (
    <div>
      <h1>x:{x}</h1>
      <Button onClick={onClick}>点我</Button>
      <Button onClick={onClick2}>点我2</Button>
    </div>
  )
}

export default lottery