关于useEffect首先需要知道以下三种情况

useEffect(()=>{
console.log('没有第二个参数，每次渲染都会触发')
})

useEffect(()=>{
console.log('第二个参数是个【】，初次挂载时会触发')
},[])

const [age,setAge] = useState(0);
const [name, setName] = useState('Tom');
useEffect(()=>{
console.log('当依赖项发生改变时(这里是当age或name发生改变时)，会触发')
},[age,name])

那么问题来了，当依赖项是引用类型的时候，会发生什么呢？看以下代码

import React, {useState, useEffect} from 'react';const EffectDemo = () => {const [user, setUser] = useState({name:'tom',age:10})useEffect(()=>{//这里会发现，即使user没有变化，但是仍然触发了console.log(user,'effect runs')},[user])const handleChange = () => {//user的值仍然设置成{name:'tom',age:10}，注意useEffect触发了没有setUser({name:'tom',age:10})}return (<div><button onClick={handleChange}>点击修改</button></div>)
}
export default EffectDemo;

产生上述情况的原因是，useEffect的Object.is方法是通过“===”进行比较的，基础数据类型比较的是值，而引用类型比较的是内存中的引用地址，所以看似值没有变化，但是引用地址变了，就也会触发useEffect

如何解决这个问题呢？如下：

useEffect(()=>{console.log(user,'effect runs')//分别监听user的值
},[user.name,user.age])