jstree类型插件不显示自定义图标 [英] jstree types plugin does not display custom icons
问题描述
我有一个简单的HTML布局，如下所示：
I have a simple HTML layout that looks like this:
<div id="foo">
<ul>
<li id="id1"><a href="#">some category 1</a>
<ul><li><a href="#">some text</a></li></ul>
<ul><li><a href="#">some text</a></li></ul>
</li>
<li id="id2"><a href="#">some category 2</a>
<ul><li><a href="#">some text</a></li></ul>
<ul><li><a href="#">some text</a></li></ul>
</li>
</ul>
</div>
jstree定义如下所示
The jstree definition looks like this
$('#foo').jstree({
"core" : {
"animation" : 0
},
"themes" : {
"theme" : "classic",
"dots" : false,
"icons" : true
},
"sort" : function (a, b) {
return this.get_text(a) > this.get_text(b) ? 1 : -1;
},
"types" : {
"valid_children" : [ "folder" ],
"types" : {
"folder" : {
"valid_children" : [ "file" ],
"icon" : { "image" : "/path/to/images/folder.png"},
"max_depth" : 1
},
"file" : {
"valid_children" : [ "none" ],
"icon" : { "image" : "/path/to/images/file.png" },
}
}
},
"plugins" : [ "html_data", "themes", "contextmenu", "search", "sort", "types" ]
});
但是，我仍然在获取文件的通用主题图标。
类别应该有一个文件夹，子类别应该有一个文件。我错过了什么吗？
However, I am still getting the generic theme icons for the files. Category should have a folder and the sub-categories should have a file. Am I missing something?
这是答案。对于每个类型，文件夹，文件等您放入列表项rel =其中的东西是文件夹和诸如此类的东西。然后在你的jstree配置中，你有类型插件的这些设置：
Here is the answer. For each type, "folder", "file", etc you put in the list item rel= where something is "folder" and whatnot. Then in your jstree configuration, you have these settings for the types plugin:
'types' : {
'valid_children' : [ 'folder' ],
'types' : {
'folder' : {
'valid_children' : [ 'file'],
'max_depth' : 1
},
'file' : {
'valid_children' : [ 'none' ],
'icon' : { 'image' : safari.extension.baseURI + 'images/file.png' },
}
}
},
我们在这里定义如何处理每个rel类型。这样，jstree将在列表项中获取rel类型，并从这些定义中找出如何处理它。
We define what to do with each "rel" type here. This way, jstree will pick up the rel type in the list item and figure out what to do with it from these definitions.
推荐答案
在版本3.x 中，您应该使用 data-jstree li属性，如下所示：
In version 3.x you should use data-jstree li attribute like this :
<html>
<ul id="browser">
<li data-jstree='{"type":"folder"}'>My folder</li>
<li data-jstree='{"type":"file"}'>My file</li>
</ul>
</html>
Javascript
Javascript
$("#browser").jstree({
"types" : {
"folder" : {
"icon" : "icon-folder-open"
},
"file" : {
"icon" : "icon-file"
}
},
"plugins" : [ "types" ]
});
这篇关于jstree类型插件不显示自定义图标的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
