React踩坑指南

React比Vue要难以掌握就在于它会给开发者带来更多的心智负担，开发者需要自己去避免一些问题，比如组件重复刷新、重复刷新带来的性能问题，而在Vue中就不存在这些问题。

组件递归刷新问题

const DetailTable = (props) => {
const { filteredId, filter: { temporary = [] } = {} } = useContext(BIContext);

const [selectedMap, setSelectedMap] = useState({});

useEffect(() => {
  if (!filteredId || !temporary.length) {
    setSelectedMap({});
  }
}, [filteredId, temporary]);

return <div>any thing</div>
}

temporary = []给了空数组默认值，会导致页面死循环，因为每次temporary为undefined时，会被赋予一个新数组，然后触发下面的useEffect，useEffct中又会setSelectedMap导致页面刷新，然后如此无限循环

🕕React踩坑指南

组件递归刷新问题