在外部 window 选项卡中打开 link

Question

谁能帮我解决这个问题？我试图让链接在外部 window 选项卡中打开，但我无法通过 href.

获得该结果

这是代码 - src/utils/menu.js:

    const menu = [
      {
        name: 'App',
        sublinks: [
          { name: 'App Store', link: 'someLink' },
          { name: 'Play Store', link: 'someLink' },
        ]
      },
      {
        ...
          },
        ]
      }
    ]
    
    module.exports = menu

export default function Menu(props) {
  return (
    <StyledMenu tabIndex={0}>
      <StyledMenuTitle>
        <span style={{ marginRight: '0.25rem' }}>{props.data.name} </span>
        <MenuFlyout>
          {props.data.sublinks.map((item, index) => {
            return (
              <StyledMenuItem tabindex={index} key={index}>
                {item.link.split('.').slice(-1)[0] === 'pdf' ? (
                  <StyledExternalLink href={item.link} target="_blank" rel="noopener noreferrer">
                    <StyledTitle>{item.name}</StyledTitle>
                  </StyledExternalLink>
                ) : (
                  <StyledExternalLink href={item.link}>
                    <StyledTitle>{item.name}</StyledTitle>
                    {item.description && <StyledDescription>{item.description}</StyledDescription>}
                  </StyledExternalLink>
                )}
              </StyledMenuItem>
            )
          })}
        </MenuFlyout>
      </StyledMenuTitle>
    </StyledMenu>
  )
}

Answer 1

我没有看到你的观点，但它看起来像

<a href={something.link}>{something.name}</a>

你应该使用

<a target="_blank" href={something.link}>{something.name}</a>

（将 target="_blank" 添加到您的链接）。

Answer 2

使用<StyledExternalLink href={item.link} target="_blank" rel="noopener noreferrer">代替<StyledExternalLink href={item.link} target="_blank" rel="noopener noreferrer**">"

target="_blank"用于在新标签页中打开链接

在外部 window 选项卡中打开 link

Open link in external window tab

javascript

menu

external-links

reactjs