layui的tree图标丢失解决

layui的tree树形菜单的最新版layui-v2.4.5版本的图标丢失,如图所示:

来源地址:https://www.layui.com/doc/modules/tree.html

搜索了社区跟百度之后发现没有啥好的办法解决,我就自己尝试去改.想要解决办法有,我本来想到更简单解决办法就是修改样式的,但是发现展开跟收起效果的类都是一样的,没办法解决:如图:

然后在社区找到一条说是tree.js控制图标的代码的.

如上图所示,只要修改这两个字体图标的代码就能解决了,这两个图标要你本地文件有的才行,现在文档里面缺失了两个图标没办法,只能去Iconfont-阿里巴巴矢量图标库找到文件夹跟展开文件库的字体图标:

下载下来,新建一个文件夹命名:iconfont,放进去刚下载的文件就好,然后在样式中写入:

body .layui-tree-skin-shihuang .layui-tree-branch {
    font-family: "iconfont" !important;
    font-size: 16px;
    font-style: normal;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

再引入刚下载的文件:

<link rel="stylesheet" href="iconfont/iconfont.css">

就可以了,还是不会用的可以下载我的压缩包查看!

本文作者： Jasmine

本文链接： https://www.jianbaizhan.com/article/609

版权声明： 本博客所有文章除特别声明外，均采用 CC BY-NC-SA 3.0 许可协议。转载请注明出处！