簡易總結react-hook三大基礎

react-hook的最重要的三大基礎

import { useEffect, useState, useContext } from 'react'

1、每一個簡單的一句話總結

useEffect // 萬能的生命周期、每次都觸發的生命周期、可以重復寫多個的生命周期
useState  // 創建值、創建改變值的方法
useContent // react自帶的redux(mobx)、方便組建間傳值

2、conState

const [count, setCount] = useState(0)

3、useEffect

// 表示只執行一次
useEffect(() => {
}, []) 

// 第一次執行，以及表示count變化時執行
useEffect(() => {
}, [count]) 

4、useContent

// 用於創建共同的父級
import { createContext } from 'react'
const UserContext = new createContext()

// 父級內容包裹上下文
// value 父級傳值的內容
<UserContext.Provider value={{ number, setNumber }}>
</UserContext.Provider>

// 子級要有方法獲取UserContext(這里是props的方法，也可以export引出然后引入)
<Content1 test={UserContext} />
// 子級然后就可以直接使用useContent獲取，並且直接調用即可
const test = useContext(state.test)