Webix树节点的字体真棒图标

Dan*_*scu 4 html css tree webix

Webix与Font Awesome集成.但是如何使用Font Awesome图标代替树中的默认文件夹/文件图标来设置单个节点的样式?

这是我尝试过的:

http://webix.com/snippet/52251623

  • template 仅适用于树级
  • $css 保留现有的文件夹/文件图标
  • 没有icon记录树木财产,但设置一个做一些事情......它改变了文件夹图标为一个文件,当节点有孩子.

Aqu*_*tic 5

对于单树,它就像下一个

webix.ui({
  view:"tree",
  type:{
    folder:function(obj){
      if (obj.$count)
        return "<span class='webix_icon fa-folder'></span>";
      return  "<span class='webix_icon fa-file'></span>";
    }
  },
  data:tree_data
})
Run Code Online (Sandbox Code Playgroud)

您可以在此处查看示例 - http://webix.com/snippet/0f3d85c3

如果要在多个树控件之间共享此行为,可以定义一次自定义类型

webix.type(webix.ui.tree, {
  name:"awesome",
  folder:function(obj){
      if (obj.$count)
        return "<span class='webix_icon fa-folder'></span>";
      return  "<span class='webix_icon fa-file'></span>";
    }
});
Run Code Online (Sandbox Code Playgroud)

然后使用类型:"awesome"来应用样式

webix.ui({
  view:"tree",
  type:"awesome",
  data:tree_data
})
Run Code Online (Sandbox Code Playgroud)

示例 - http://webix.com/snippet/79dbe741