Skip to content

图标

线上图标

rengar-admin内置了iconify的图标库,你可以直接使用这些图标。所有图标的前缀必须以i-开头

  1. 使用封装的组件引入:
    vue
    <SvgIcon icon="i-ri-home-3-line" />
    SvgIcon会自动引入,无需手动引入
  2. 使用class的方式引入:
    vue
    <i class="i-ri-home-3-line"></i>

    提示

    图标规则,i-[iconify 图标库名称]-[图标名称]

本地 svg 图标

把需要使用的 svg 图标放到项目的src/assets/svg-icons目录下即可使用。所有图标的前缀必须以i-loacal-开头

假如你有一个src/assets/svg-icons/logo.svg的图标,你可以这样使用:

  1. 使用封装的组件引入:
    vue
    <SvgIcon local-icon="i-local-logo" />
  2. 使用class的方式引入:
    vue
    <i class="i-local-logo"></i>

提示

导入新图标后,需要重启项目

logo 修改: public/favicon.icosrc/assets/svg-icons/logo.svg修改为自己的 logo,文件名和格式不能改变。