React函数组件如何在Redux Store中logoPic更新时触发重渲染？

你当前的代码里，useSelector返回的是整个user对象，而Redux的useSelector默认用**严格相等（===）**对比前后两次返回的值。这就意味着，只要user对象里任意一个属性（比如downloadLink、organizationName）发生变化，哪怕logoPic没动，组件都会触发重渲染，不符合你的需求。

要实现仅当logoPic值更新时才重渲染，可以按以下方式修改：

方案1：直接返回logoPic（推荐，若组件只需要这个值） #

把useSelector的返回值改成直接取logoPic，这样只有当logoPic的实际值发生变化时，才会触发组件重渲染：

const logoPic = useSelector((state) => state.loginReducer.user.logoPic);

方案2：若需要多个属性，但仅关心logoPic的变化（谨慎使用） #

如果你确实需要user里的其他属性，但只想在logoPic变化时重渲染，可以自定义比较函数，告诉useSelector只对比logoPic：

import { useSelector } from 'react-redux';

const { user: { downloadLink, bucketName, timeStamp, logoPic, organizationName, logoName } } = useSelector(
  (state) => state.loginReducer,
  (prevState, nextState) => {
    // 仅对比logoPic是否相等，相等则不触发重渲染
    return prevState.user.logoPic === nextState.user.logoPic;
  }
);

⚠️ 注意：这种写法要谨慎，因为当其他属性变化时组件不会重渲染，可能导致页面显示内容和Redux状态不一致，只有在你确定不需要同步其他属性显示时才用。

内容的提问来源于stack exchange，提问作者Prashanth K.A