简易总结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)

  

posted @ 2019-09-18 11:37  kimingw  阅读(974)  评论(0编辑  收藏  举报