hooks之useState

import React, {
      Component, useState } from 'react'

// 类写法
class App extends Component {
     
  constructor() {
     
    super()
    this.state = {
     
      count: 0,
    }
  }
  render() {
     
    const {
      count } = this.state
    return (
      <button onClick={
     () => {
      this.setState({
      count: count + 1 }) }}>Click ({
     count})</button>
    )
  }
}

// hooks写法
function UseStateAPI(props) {
     
  const [count, setCount] = useState(0)
 // const [sum,setSum] = useState(() =>{
     
    // 回调延迟初始化sum的值,只会运行一次
 //  return props.defaultSum || 0
 // })
  
  return (
    <button onClick={
     () => {
      setCount(count + 1) }}>Click ({
     count})</button>
  )
}

export default UseStateAPI  

从以上看出类定义state变量的区别,更简洁