一、将icon的svg文件放置如下图文件位置

二、在路由设置中设置（icon设置为svg的文件名称即可）

        

注：若icon选中的颜色不会随着侧边栏文字颜色变动，把svg文件中的fill去掉即可

vue-element-admin 之设置侧边栏的icon的更多相关文章

  1. vue element Admin - 修改浏览器标签名 + 添加tagView标签 +固定导航头部 + 添加侧边栏Logo

    1 .修改浏览器标签名称: 修改浏览器标签名称在文件:\src\settings.js   image.png 2 .修改固定头部Header和侧边栏 Logo:   image.png 1)侧边栏文 ...

  2. vue element 时间选择器设置禁用日期

    在 el-date-picker 组件中有一个 picker-options 属性 disabledDate 可以设置日期的可选范围 <el-date-picker v-model=" ...

  3. Vue Element使用第三库icon图标

    一:引入单设图标 1.打开 阿里icon,注册 >登录>图标管理>我的项目 2.新建项目 返回阿里icon首页,点进去你想要的icon库,因为没有批量导入购物车,所以一般情况下需要一 ...

  4. Vue Element 使用 icon 图标 (第三方)

    Vue Element 使用 icon 图标 (第三方) element-ui 自带的图标库还是不够全, 还是需要需要引入第三方 icon, 自己在用的时候一直有些问题, 参考了些教程, 详细地记录补 ...

  5. 循序渐进VUE+Element 前端应用开发(17）--- 菜单资源管理

    在权限管理系统中,菜单也属于权限控制的一个资源,应该直接应用于角色,和权限功能点一样,属于角色控制的一环.不同角色用户,登录系统后,出现的系统菜单是不同的.在VUE+Element 前端中,我们菜单结 ...

  6. Vue+Element实现网页版个人简历系统

    这篇文章介绍一个使用Vue+Element实现的个人简历系统,主要用到的技术有:vue.element.css3.css定位. 作者在window10进行开发,目前只在chrome上进行过测试,没有大 ...

  7. 循序渐进VUE+Element 前端应用开发(3）--- 动态菜单和路由的关联处理

    在我开发的很多系统里面,包括Winform混合框架.Bootstrap开发框架等系列产品中,我都倾向于动态配置菜单,并管理对应角色的菜单权限和页面权限,实现系统对用户权限的控制,菜单一般包括有名称.图 ...

  8. 循序渐进VUE+Element 前端应用开发(4）--- 获取后端数据及产品信息页面的处理

    在前面随笔<循序渐进VUE+Element 前端应用开发(3)--- 动态菜单和路由的关联处理>中介绍了在Vue + Element整合框架中,实现了动态菜单和动态路由的处理,从而可以根据 ...

  9. 循序渐进VUE+Element 前端应用开发(8）--- 树列表组件的使用

    在我前面随笔<循序渐进VUE+Element 前端应用开发(6)--- 常规Element 界面组件的使用>里面曾经介绍过一些常规的界面组件的处理,主要介绍到单文本输入框.多文本框.下拉列 ...

随机推荐

  1. Spring事务管理3----声明式事务管理（1）

     声明式事务管理(1)基于    基于 tx/aop  这种事务管理相比编程式事务管理来说对业务层基本没有改动,通过  TransactionProxyFactoryBean 创建业务层的代理,通过A ...

  2. 为TMenuItem增加指针Data属性

    Delphi的有些组件中都包含.Data属性,比如TTreeNode,.Data属性可以认为是一个指针,可以指向任何类或者结构,方便后续操作. 但是TMenuItem没有.Data属性,下面介绍最简单 ...

  3. redis watch 加 事务实现秒杀

    <?php   //redis watch 加 事务实现秒杀  $redis = new redis();  $result = $redis->connect('10.10.10.119 ...

  4. ubuntu 18.04设置开机自动挂载移动硬盘

    首先在命令行执行df -h指令,可以看到如下结果: zifeiy@zifeiy-PC1:~$ df -h 文件系统 容量 已用 可用 已用% 挂载点 udev 964M 0 964M 0% /dev ...

  5. Vue父子组件传值$parent , ref,$refs，props大总结

    子组件: <template> <div class="child"> <slot name='meiyong'></slot> & ...

  6. eNSP——ARP及ProxyARP

    原理: ARP (Address Resolution Protocol)是用来将IP地址解析为MAC地址的协议.ARP表项可以分为动态和静态两种类型.动态ARP是利用ARP广播报文,动态执行并自动进 ...

  7. rqnoj PID95:多多看DVD(加强版)

    题目描述 多多进幼儿园了,今天报名了.只有今晚可以好好放松一下了(以后上了学后会很忙).她的叔叔决定给他买一些动画片DVD晚上看.可是爷爷规定他们只能在一定的时间段L看完.(因为叔叔还要搞NOIP不能 ...

  8. NLP文本清理时常用的python小函数

    # coding = utf-8 import re 1. 清理杂七杂八字符 ''' [a-zA-Z0-9] 字母数字 [\u4e00-\u9fa5] 汉字的utf-8 code范围 ''' # 保留 ...

  9. C语言字符串替换

    void exchg(char * str) { if(str == NULL) return; int len = strlen(str); char tmp; for(int i=0,j=len- ...

  10. Markdown Note

    Markdown-Note 1.基本编辑 粗体和斜体 源代码: *斜体*或_斜体_ **粗体** ***加粗斜体*** ~~删除线~~ 显示效果: 斜体或_斜体_ 粗体 加粗斜体 删除线 分级标题 第 ...