如何在antd vue pro的动态菜单中使用自己的图标？

• Z时代
• 2024-02-26
• 分类：IT

请教：如何在antd vue pro的左侧动态菜单中使用自定义的图标？

回答：

找到一种解决办法：

1. 在iconfont网站中把需要的图标放到项目中，在项目设置中把css前缀改成anticon
2. 在public/index.html中引用iconfont生成的css
3. 在系统管理 - 菜单管理的图标输入框，输入不带前缀的icon名称
4. 在html中引入这段css：

    .anticon:before {
      display: block !important;
    }

因为对代码不熟悉，暂时只能想到这种办法……

回答：

如果是动态图标你得弄一个变量：
数据data那头就this.icon=''

 <a-icon :type="{icon}" />

但是你要用自己的图标就自己打个img标签呗，在菜单表扩一个存放png图片路径字段。做菜单大循环for时一起带进来。

<div class="navIcon">
  <img :src='{icon}'>
</div>
数据data那头还是初始化下
this.icon=''

仅供参考，如果更好请补充！

以上是 如何在antd vue pro的动态菜单中使用自己的图标？ 的全部内容， 来源链接： utcz.com/p/935781.html