react - 初识hoos - useState 和 useE

hooks 中在也不需要this的概念了，并且必须放到函数组件内部最外层 最上面

引入 useState 和 useEffect 

import React, { useState, useEffect } from "react";

useState 

先看一个例子：

const [count, setCount] = useState(0);

其实就是es6的数组解构

 useState(params) 设置 第一个参数的初始值 

count 是解构出的第一个参数 

setCount 是第二个参数 是一个函数 用来设置count 

可以这么操作 setCount(count + 1); 这样 count 设置称为最新的值

useEffect  

它接受2个参数，第一个是函数，第二个是数组

如果第二个参数数组为空 它就是componentDidMount 只有第一次渲染

如果二个参数数组 里面的值 设置的 值改变 它就是componentDidUpdate 只要值改变了 他就渲染

useEffect 内部 最外层 支持return () =>  相当于 componentWillUnmount 卸载 来开当前组件的时候触发 并且 每次更新 都触发

对了 useState 和 useEffect  支持写多个

例如：

const [count, setCount] = useState(0);

const [count2, setCount2] = useState(0);

useEffect(() => {

},[])

useEffect(() => {

},[xxx])

我的demo

有写错的地方，欢迎指正，不胜感激！

笔者QQ群：148042812