首页 > 解决方案 > 在外部窗口选项卡中打开链接

问题描述

谁能帮我解决这个问题?我试图让链接在外部窗口选项卡中打开,但我无法使用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>
  )
}

标签: javascriptreactjsmenuexternal-links

解决方案


我没有看到你的观点,但它看起来像而不是

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

你应该使用

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

(添加target="_blank"到您的链接)。


推荐阅读