在 React 的 forEach 中将字符串显示为链接答案

【问题标题】：Display string as link in React's forEach在 React 的 forEach 中将字符串显示为链接
【发布时间】：2020-12-04 05:17:19
【问题描述】：

我有一个如下所示的链接数组：

我需要将它呈现为链接，我正在尝试这样做：

export const LinksPure = (props: AllProps) => {
  const { t } = useTranslation();
  const { component } = props;

  return (
    <DetailsBox title={t('catalogPage.componentDetails.specs.links')}>
      <Typography variant="body1" component="p" gutterBottom>
        {component?.external_links.forEach(link => {
          // link
        })}
      </Typography>
    </DetailsBox>
  );
};

下面是我想要的效果模拟：

如何格式化forEach中的这些字符串以将其转换为链接？

【问题讨论】：

标签： reactjs typescript

【解决方案1】：

forEach 总是返回undefined，它不会渲染任何东西。使用map。

{component?.external_links.map(link => <a>...</a>)}

【讨论】：