iconify-icons 的使用

<el-button
    type="primary"
    :icon="useRenderIcon('ri:delete-bin-line')"
    :disabled="!canDelete(multipleSelection)"
    @click="handleDelete"
    >删除</el-button
  >

当我们按照上面的代码引入图标的时候，当我们的环境是只能访问内网不能访问公网的时候，我们的图标就不能正常的展示出来， 我们这个时候，就要下载对应的依赖包，这样就不用请求外网获取了例如我们要使用ep和ri两个包中的图标：

• "@iconify-icons/ep": "^1.2.12",
• "@iconify-icons/ri": "^1.2.10",

使用的示例：

import DeleteBinLine from "@iconify-icons/ri/delete-bin-line";

<el-button
    type="primary"
    :icon="useRenderIcon(DeleteBinLine)"
    :disabled="!canDelete(multipleSelection)"
    @click="handleDelete"
    >删除</el-button
  >

官网：icon-sets.iconify.design/

图片标出来的就是图标类名和图标名

使用:icon="useRenderIcon('ri:delete-bin-line')"字符串引用图标的是，网址第一次访问的之后，会把需要的图标获取，然后，放在localstorage中，如下图所示：