reactjs 根据条件渲染不同的组件

dgjrabp2 于 2023-02-04 发布在 React

关注(0)|答案(1)|浏览(182)

我正尝试根据条件呈现组件。

exceptPath: ['home', 'person']
pathName = 'test'

return (
  <React.Fragment>
    {this.state.exceptPathNames.map((exceptPathName) => {
      console.log(exceptPathName);
      pathName === exceptPathName ? console.log('test') : <LinkGridLayout />;
    })}
  </React.Fragment>
);

如果pathName不是"home"或"person"，我希望返回<LinkGridLayout />，否则不返回任何内容。

reactjs

来源：https://stackoverflow.com/questions/75316682/render-different-component-based-on-condition

1条答案

按热度按时间

68bkxrlz1#

如果您想要做的只是为任何pathName值呈现一个LinkGridLayout组件，而**不是***"home"或"person"（ 或excludePath中的任何值 *），那么我建议使用下面的重构来检查数组中是否没有元素等于pathName，如果是，则有条件地呈现LinkGridLayout。
示例：

exceptPath: ['home', 'person']

return (
  <>
    {!exceptPath.some((exceptPathName) => pathName === exceptPathName) && (
      <LinkGridLayout />
    )}
  </>
);

或

return (
  <>
    {exceptPath.every((exceptPathName) => pathName !== exceptPathName) && (
      <LinkGridLayout />
    )}
  </>
);

赞(0）回复(0）举报 2023-02-04

我来回答

reactjs 根据条件渲染不同的组件

1条答案

相关问题

热门标签

最新问答