我习惯了export default React.memo(SomeComponent);,因此React可以记住我的组件。

但是在我使用命名导出的文件中。如何使用React.memo()

export {React.memo(MainPostTopic), React.memo(MainPostSubtopic)};

上面的行不起作用。

示例文件
function MainPostTopic(props) {
  console.log('Rendering MainPostTopic...');
  return(
    <LS.Topic_H2 id={props.id}>
      {props.value}
    </LS.Topic_H2>
  );
}

function MainPostSubtopic(props) {
  console.log('Rendering MainPostSubtopic...');
  return(
    <LS.Subtopic_H3>
      {props.value}
    </LS.Subtopic_H3>
  );
}

export {MainPostTopic, MainPostSubtopic};

最佳答案

这就是我最终要做的事情:

const MainPostTopic = React.memo(
  function MainPostTopic(props) {
    console.log('Rendering MainPostTopic...');
    return(
      ...
    );
  }
);

const MainPostSubtopic= React.memo(
  function MainPostSubtopic(props) {
    console.log('Rendering MainPostSubtopic...');
    return(
      ...
    );
  }
);

export {MainPostTopic, MainPostSubtopic};

我对函数和导出使用相同的名称。

09-17 04:49