jsTree 使用笔记 图标的显示
1,引入
在官网下载压缩包,解压后所需文件在dist文件夹下
themes里是css所需的文件
在文件中引入<link rel="stylesheet" href="dist/themes/default/style.min.css" />
引入js<script src="dist/jstree.min.js"></script>
2,创建示例,监听点击改变触发函数,这些官网上有
我想记录一下jstree的图标,怎么根据类型的不同显示不同的图标
$('#jstree_demo').jstree({
"core" : {
"animation" : 0,
"check_callback" : true,
"themes" : { "stripes" : true },
'data' : {
'url' : function (node) {
return node.id === '#' ?
'ajax_demo_roots.json' : 'ajax_demo_children.json';
},
'data' : function (node) {
return { 'id' : node.id };
}
}
},
"types" : {
"#" : {
"max_children" : 1,
"max_depth" : 4,
"valid_children" : ["root"]
},
"root" : {
"icon" : "/static/3.3.8/assets/images/tree_icon.png",
"valid_children" : ["default"]
},
"default" : {
"valid_children" : ["default","file"]
},
"file" : {
"icon" : "glyphicon glyphicon-file",
"valid_children" : []
}
},
"plugins" : [
"contextmenu", "dnd", "search",
"state", "types", "wholerow"
]
});
这是官网的示例代码 plugins插件选项 types就控制着图标
types里可以有很多选项 default是默认图标,如果想全部的图标都不显示,themes里添加:icons:false
core: {
themes: { theme: 'classic', icons: false },
data: companies,
},
如果想要只是默认的类型不显示
types: {
default: {
icon: false,
},
},