Vue3.0商店后台管理系统项目实战-导航的icon图标

简介: Vue3.0商店后台管理系统项目实战-导航的icon图标

参考资料

Vue3.0官方文档:https://cn.vuejs.org/

Element Plus文档:https://element-plus.gitee.io/zh-CN/

Element Plus 提供了一套常用的图标集合

1:安装

# NPM
$ npm install @element-plus/icons-vue

图片.png

2:在main.js引入

main.js

import { createApp } from 'vue'
import ElementPlus from 'element-plus'
import 'element-plus/dist/index.css'
import App from './App.vue'
import router from './router'
import store from './store'
import * as ElementPlusIconsVue from '@element-plus/icons-vue'
const app=createApp(App)
for (const [key, component] of Object.entries(ElementPlusIconsVue)) {
    app.component(key, component)
  }
app.use(store).use(router).use(ElementPlus).mount('#app')

3:基础用法

点击图标进行复制

在这个代码里面粘贴即可

查看效果

自己想要的图标已经放在上面啦

相关文章
|
10月前
|
JavaScript
Vue引入字节跳动图标库
Vue引入字节跳动图标库
244 0
Vue引入字节跳动图标库
|
JavaScript 前端开发
Vue项目实战(09)- svg图标的使用
Vue项目实战(09)- svg图标的使用
234 0
vue3+vite项目中使用svg图标
vue3+vite项目中使用svg图标
980 0
|
3月前
|
JavaScript
vue使用iconfont图标
vue使用iconfont图标
168 1
|
10月前
|
JavaScript 前端开发
iconfont 图标在vue里的使用
iconfont 图标在vue里的使用
624 0
|
6月前
|
JavaScript
vue项目中引入阿里图标iconfont
该文章指导如何在Vue项目中引入并使用阿里图标库Iconfont,包括图标的选取、下载配置文件及在项目中引入和使用图标的具体步骤。
|
8月前
|
JavaScript 区块链
vue 自定义网页图标 favicon.ico 和 网页标题
vue 自定义网页图标 favicon.ico 和 网页标题
316 1
|
8月前
|
XML JavaScript 前端开发
vue实战——图标,请使用SVG!(含插件vue-svg-icon的使用)
vue实战——图标,请使用SVG!(含插件vue-svg-icon的使用)
301 1
Vue3使用element-plus图标,局部引入写法
Vue3使用element-plus图标,局部引入写法
Vue3 antdv 如何动态渲染 icons-vue 图标(a-icon 不支持了)
Vue3 antdv 如何动态渲染 icons-vue 图标(a-icon 不支持了)
510 0

热门文章

最新文章