React Hooks与easy-peasy学习笔记

React Hooks

1. useState

useState这个函数接收的参数是state的初始值，它返回一个数组

该数组的第一个值表示当前状态值

第二个值表示更新状态值的函数

let countArray = useState(0)
let count = countArray[0]
let setCount = countArray[1]

等价于

使用ES6的数组解构语法糖

const [count, setCount] = useState(0)

{count}显示状态值

setCount更新状态值，有两种写法

一种是直接传入值setCount(count+1)

另外一种是传入箭头函数

setCount((c) => c + 1)

export default function UseStatePage() {
    const [count, setCount] = useState(0)

    return 

        
count = {count}
        
写法一,直接传入数值
         setCount(count + 1)}>add
         setCount(count - 1)}>minus
        
写法二,参数为箭头函数
         setCount((c) => c + 1)}>add
         setCount((c) => c - 1)}>minus
    
}