useEffect监听props的属性?

作者站长头像
站长
· 阅读数 14
// 子组件
import React, { useEffect } from 'react';

export default ({ data = [] }) => {
  useEffect(() => {
    console.log(1);
  }, [data]);
  return <div>哈哈哈</div>;
};

发现一个有趣的现象,监听props时候,有时候我们会给props的一些属性设置默认值,比如[] {} ,所以每次父组件更新时候,并且这个data不传或者undefined时候, 都会导致useEffect被触发,

现在有个疑问,组件props内的属性设置默认值好还是不设置好,, 设置了就有上面的问题,纠结

回复
1个回答
avatar
test
2024-07-20

你可以换一种设置方式的

export default (props) => {
 const {data = [] } = props
  useEffect(() => {
    console.log(1);
  }, [props.data]);
  return <div>哈哈哈</div>;
};
回复
likes
适合作为回答的
  • 经过验证的有效解决办法
  • 自己的经验指引，对解决问题有帮助
  • 遵循 Markdown 语法排版，代码语义正确
不该作为回答的
  • 询问内容细节或回复楼层
  • 与题目无关的内容
  • “赞”“顶”“同问”“看手册”“解决了没”等毫无意义的内容