useMemo 和 useEffect 区别

著名问题：Cannot update a component from inside the function body of a different component，github issue

useEffect

官方文档有说过 当你调用 useEffect 时，就是在告诉 React 在完成对 DOM 的更改后运行你的“副作用”函数

所以这个顺序很好理解

因为修改了名字，然后react更改了DOM，触发了getProductName 随后调用了name的effect（在dom更新之后触发，这也是为什么叫做副作用） effect中调用了getProductName

useMemo

为什么useMemo可以解决？官方文档说过传入 useMemo 的函数会在渲染期间执行，所以使用useMemo就能解决之前的问题，怎么在DOM改变的时候，控制某些函数不被触发。 和useMemo相近的还有一个useCallback，只是后者返回一个函数useCallback(fn, deps) 相当于 useMemo(() => fn, deps)，这里我们返回一个memo函数，