React.memo：比较props时使用哪个组件实例作为prevProps？

React.memo 的缓存逻辑是绑定到组件实例上的，它会将当前传入的 nextProps 和同一组件实例上一次渲染周期中使用的 props做对比。

自定义对比函数里的 prevProps，就是这个组件实例在上一次完成渲染时接收到的 props 值——简单说，就是该组件“上一次用的 props”。

需要注意的是，同一个组件的不同实例（比如列表里循环渲染的多个相同组件），它们的缓存是完全独立的。每个实例只会和自己上一次的 props 做对比，不会和其他实例的 props 产生关联。

举个直观的代码例子：

// 用React.memo包裹组件，自定义对比逻辑
const MemoizedCard = React.memo(CardComponent, (prevProps, nextProps) => {
  // 这里的prevProps是当前CardComponent实例上一次渲染的props
  return prevProps.userId === nextProps.userId;
});

// 渲染两个独立的组件实例
<MemoizedCard userId={101} />
<MemoizedCard userId={102} />

上面两个MemoizedCard实例的prevProps分别对应自己上一次的userId，彼此完全独立。

内容的提问来源于stack exchange，提问作者zhulien