1回答

张轩

2020-10-28

已采纳

同学你好 react 更新组件默认有三种情况 第一属性改变 第二内部状态state改变 第三父组件更新（这里属于第三种情况，虽然Hello 都props 和 state 都没有更新），在 class 类型的 React 组件中，我们有 shouldComponentUpdate 和 PureComponent 帮我们完成 props 的对比和判断，在 hooks 中，我们可以使用 React.memo 来完成这个任务。https://zh-hans.reactjs.org/docs/hooks-faq.html#how-do-i-implement-shouldcomponentupdate

你可以这样修改一下你的代码 

import React, { useContext, memo } from 'react'

const Hello: React.FC<IHelloProps> = memo((props) => {
 ...
})

再试一下 会发现这个打印就消失了

结论就是 React.memo 等效于 PureComponent，它会帮你多做一件事情，比较新的props和旧的props，假如没有变化，就不更新这个组件

0

2

ywang04

老师 memo本身也要消耗性能 我们在什么情况下才会考虑到使用它并且忽略它自身的性能损耗？谢谢

2021-01-07

共2条回复