useEffect学习随笔

hooks是react重要的手段
因此也借此机会，学习了一波useEffect的使用，记录随笔以备日后查阅

当我们写一个函数，我们希望的是这个函数返回的是一个页面来进行显示
那么其余和数据计算以及显示的操作，我们把其称为副作用
比如我们想显示一个页面，我们需要从后台调用接口来进行数据的获取
这个操作就属于副作用，可以使用useEffcet来进行实现
并且useEffect的出现也可以代替生命周期API来产生相应的作用

但我们在进行学习的时候，我们应该学会unlearning （忘记）
也就是忘记我们之前的生命周期（之前的知识会更好的辅助我们理解useEffct，而不应该影响我们学习）

useEffect的引用：

//顶部引入useEffect,并且在函数中进行使用
import React, { useState, useEffect } from 'react';
function a () => {
useEffect(()=>{})
}

执行规则，当useEffcet只有一个参数的时候，默认是在页面渲染完成的时候调用以及组件更新之后调用
组件每渲染一次，该函数就自动执行一次

但有时候，我们不想其每次更新的时候都调用

1.我们只想在最开始的时候调用一次
例如：我们从后端请求数据来显示，我们只想在页面开始的时候进行一次请求就好
这个时候就需要设置第二个参数为[]，即可实现
此时它只会在页面初次渲染的时候调用一次，其余不再执行

function a () => {
useEffect(()=>{
console.log("1")
//这里设置为[]，那么该useEffect只在页面渲染时候调用一次
},[])
}

2.我们只想在某个值变化的时候进行调用

function a () => {
useEffect(()=>{
console.log("name")
//这里第二个参数传入name ,那么上面这个打印语句就只会在name数值发生变化的时候进行调用
},[name])
}

useEffect() 的返回值

useEffect()允许返回一个函数，在组件卸载时，执行该函数，清理副效应

useEffcet注意点

使用useEffect()时，有一点需要注意。如果有多个副效应，应该调用多个useEffect()，而不应该合并写在一起。（我惊了，因为我就是写在一起的）