ant design vue pro admin菜单如果是外链，点击新标签页打开

// 菜单数据示例
const menuData = [
  {
    name: '外部链接',
    icon: 'external-link', // 图标（可选）
    href: 'http://www.example.com', // 外部链接地址
    target: '_blank', // 添加这个属性表示在新标签页打开
  },
  // ...其他菜单项
];

// 在Ant Design Pro Vue中可能通过layout组件传递给ProLayout
<ProLayout>
  // ...
  :menuData="menuData"
</ProLayout>

import { Link } from 'vue-router'; // 或者是您项目中实际使用的路由Link组件

function renderItem(item) {
  const meta = Object.assign({}, item.meta);
  const target = meta.target || null;
  const hasRemoteUrl = /^http(s)?:\/\//.test(item.path); // 假设httpReg是匹配http/https的正则表达式

  let CustomTag;
  let props;
  let attrs;

  if (hasRemoteUrl || target) {
    CustomTag = 'a';
    attrs = {
      href: item.path,
      target: target || '_blank', // 如果target为null，则默认新标签页打开
    };
  } else {
    CustomTag = Link;
    props = { to: { name: item.name } };
  }

  return (
    <CustomTag {...attrs} {...props}>
      {/* 这里放置菜单项的内容 */}
      {item.name}
    </CustomTag>
  );
}

// 在需要渲染菜单的地方使用
return (
  <div>
    {menuData.map(item => (
      <li key={item.name}>
        {renderItem(item)}
      </li>
    ))}
  </div>
);