{"id":227,"date":"2022-12-12T02:41:18","date_gmt":"2022-11-07T14:02:14","guid":{"rendered":"https:\/\/www.silicloud.com\/zh\/blog\/index.php\/2023\/11\/30\/primefaces-%e6%a0%91tree%e3%80%81%e6%a0%91%e8%8a%82%e7%82%b9treenode%e3%80%81%e6%a0%91%e8%a1%a8treetable-%e7%a4%ba%e4%be%8b%e6%95%99%e7%a8%8b\/"},"modified":"2025-08-01T02:40:16","modified_gmt":"2025-07-31T18:40:16","slug":"primefaces-%e6%a0%91tree%e3%80%81%e6%a0%91%e8%8a%82%e7%82%b9treenode%e3%80%81%e6%a0%91%e8%a1%a8treetable-%e7%a4%ba%e4%be%8b%e6%95%99%e7%a8%8b","status":"publish","type":"post","link":"https:\/\/www.silicloud.com\/zh\/blog\/primefaces-%e6%a0%91tree%e3%80%81%e6%a0%91%e8%8a%82%e7%82%b9treenode%e3%80%81%e6%a0%91%e8%a1%a8treetable-%e7%a4%ba%e4%be%8b%e6%95%99%e7%a8%8b\/","title":{"rendered":"PrimeFaces\u6811\u5f62\u7ec4\u4ef6\u6df1\u5ea6\u6559\u7a0b\uff1aTree\u3001TreeNode\u4e0eTreeTable\u5b9e\u6218\u6307\u5357"},"content":{"rendered":"<p>\u8fd9\u662f\u6587\u7ae0\u300aPrimeFaces \u6811(Tree)\u3001\u6811\u8282\u70b9(TreeNode)\u3001\u6811\u8868(TreeTable) \u793a\u4f8b\u6559\u7a0b\u300b\u7684\u7b2c1\u90e8\u5206\uff08\u517113\u90e8\u5206\uff09\u3002<\/p>\n<p>\u4e3a\u4e86\u6709\u6548\u5c55\u793a\u5c42\u6b21\u7ed3\u6784\u6570\u636e\u5e76\u6784\u5efa\u7f51\u7ad9\u5bfc\u822a\uff0cPrimeFaces \u63d0\u4f9b\u4e86\u5f3a\u5927\u7684\u6811\u548c\u6811\u8868\u7ec4\u4ef6\u3002\u7136\u800c\uff0c\u5145\u5206\u5229\u7528\u8fd9\u4e9b\u7ec4\u4ef6\u5e76\u975e\u6613\u4e8b\uff0c\u5b83\u4eec\u6d89\u53ca\u5927\u91cf\u7684\u6280\u672f\u7ec6\u8282\u3002\u4e92\u8054\u7f51\u4e0a\u73b0\u6709\u7684\u6280\u672f\u6587\u6863\u5bf9\u8fd9\u4e9b\u95ee\u9898\u4ec5\u6709\u96f6\u6563\u7684\u63d0\u53ca\uff0c\u751a\u81f3\u6709\u4e9b\u5173\u952e\u90e8\u5206\u5b8c\u5168\u7f3a\u5931\u3002\u672c\u6559\u7a0b\u65e8\u5728\u4e3a\u60a8\u63d0\u4f9b\u4e00\u4efd\u5168\u9762\u7684\u6307\u5357\uff0c\u5e2e\u52a9\u60a8\u6df1\u5165\u7406\u89e3\u5e76\u5145\u5206\u53d1\u6325\u8fd9\u4e9b\u7ec4\u4ef6\u7684\u5f3a\u5927\u529f\u80fd\u3002<\/p>\n<h2>PrimeFaces \u6811\u5f62\u7ec4\u4ef6\u57fa\u7840\u4fe1\u606f<\/h2>\n<div class=\"post-table\">\n<table>\n<thead>\n<tr>\n<th>\u4fe1\u606f<\/th>\n<th>\u6811 (Tree)<\/th>\n<\/tr>\n<\/thead>\n<tbody>\n<tr>\n<td>\u7ec4\u4ef6\u7c7b<\/td>\n<td><code>org.primefaces.component.tree.Tree<\/code><\/td>\n<\/tr>\n<tr>\n<td>\u7ec4\u4ef6\u7c7b\u578b<\/td>\n<td><code>org.primefaces.component.Tree<\/code><\/td>\n<\/tr>\n<tr>\n<td>\u7ec4\u4ef6\u5bb6\u65cf<\/td>\n<td><code>org.primefaces.component<\/code><\/td>\n<\/tr>\n<tr>\n<td>\u6e32\u67d3\u5668\u7c7b\u578b<\/td>\n<td><code>org.primefaces.component.TreeRenderer<\/code><\/td>\n<\/tr>\n<tr>\n<td>\u6e32\u67d3\u5668\u7c7b<\/td>\n<td><code>org.primefaces.component.tree.TreeRenderer<\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<h2>PrimeFaces \u6811\u7684\u5c5e\u6027<\/h2>\n<div class=\"post-table\">\n<table>\n<thead>\n<tr>\n<th>\u540d\u79f0<\/th>\n<th>\u9ed8\u8ba4\u503c<\/th>\n<th>\u7c7b\u578b<\/th>\n<th>\u63cf\u8ff0<\/th>\n<\/tr>\n<\/thead>\n<tbody>\n<tr>\n<td><code>id<\/code><\/td>\n<td><code>null<\/code><\/td>\n<td><code>String<\/code><\/td>\n<td>\u7ec4\u4ef6\u7684\u552f\u4e00\u6807\u8bc6\u7b26\u3002<\/td>\n<\/tr>\n<tr>\n<td><code>rendered<\/code><\/td>\n<td><code>true<\/code><\/td>\n<td><code>Boolean<\/code><\/td>\n<td>\u5e03\u5c14\u503c\uff0c\u7528\u4e8e\u6307\u5b9a\u7ec4\u4ef6\u662f\u5426\u6e32\u67d3\u3002\u8bbe\u7f6e\u4e3a <code>false<\/code> \u65f6\uff0c\u7ec4\u4ef6\u5c06\u4e0d\u88ab\u6e32\u67d3\u3002<\/td>\n<\/tr>\n<tr>\n<td><code>binding<\/code><\/td>\n<td><code>null<\/code><\/td>\n<td><code>Object<\/code><\/td>\n<td>\u4e00\u4e2a EL \u8868\u8fbe\u5f0f\uff0c\u6620\u5c04\u5230\u540e\u7aef Bean \u4e2d\u7684\u670d\u52a1\u5668\u7aef <code>UIComponent<\/code> \u5b9e\u4f8b\u3002<\/td>\n<\/tr>\n<tr>\n<td><code>widgetVar<\/code><\/td>\n<td><code>null<\/code><\/td>\n<td><code>String<\/code><\/td>\n<td>\u5ba2\u6237\u7aef\u5c0f\u90e8\u4ef6\u7684\u540d\u79f0\u3002<\/td>\n<\/tr>\n<tr>\n<td><code>value<\/code><\/td>\n<td><code>null<\/code><\/td>\n<td><code>Object<\/code><\/td>\n<td>\u4f5c\u4e3a\u540e\u7aef\u6a21\u578b\u7684 <code>TreeNode<\/code> \u5b9e\u4f8b\u3002<\/td>\n<\/tr>\n<tr>\n<td><code>var<\/code><\/td>\n<td><code>null<\/code><\/td>\n<td><code>String<\/code><\/td>\n<td>\u8bf7\u6c42\u4f5c\u7528\u57df\u53d8\u91cf\u7684\u540d\u79f0\uff0c\u7528\u4e8e\u5f15\u7528\u6bcf\u4e2a\u6811\u8282\u70b9\u7684\u6570\u636e\u3002<\/td>\n<\/tr>\n<tr>\n<td><code>dynamic<\/code><\/td>\n<td><code>false<\/code><\/td>\n<td><code>Boolean<\/code><\/td>\n<td>\u6307\u5b9a Ajax\/\u5ba2\u6237\u7aef\u5207\u6362\u6a21\u5f0f\u3002<\/td>\n<\/tr>\n<tr>\n<td><code>cache<\/code><\/td>\n<td><code>true<\/code><\/td>\n<td><code>Boolean<\/code><\/td>\n<td>\u6307\u5b9a\u52a8\u6001\u52a0\u8f7d\u8282\u70b9\u7684\u7f13\u5b58\u3002\u8bbe\u7f6e\u4e3a <code>true<\/code> \u65f6\uff0c\u5c55\u5f00\u7684\u8282\u70b9\u5c06\u4fdd\u7559\u5728\u5185\u5b58\u4e2d\u3002<\/td>\n<\/tr>\n<tr>\n<td><code>onNodeClick<\/code><\/td>\n<td><code>null<\/code><\/td>\n<td><code>String<\/code><\/td>\n<td>\u5f53\u6811\u8282\u70b9\u88ab\u70b9\u51fb\u65f6\u8981\u5904\u7406\u7684 JavaScript \u4e8b\u4ef6\u3002<\/td>\n<\/tr>\n<tr>\n<td><code>selection<\/code><\/td>\n<td><code>null<\/code><\/td>\n<td><code>Object<\/code><\/td>\n<td>\u7528\u4e8e\u5f15\u7528\u9009\u5b9a\u8282\u70b9\u7684 <code>TreeNode<\/code> \u6570\u7ec4\u3002<\/td>\n<\/tr>\n<tr>\n<td><code>style<\/code><\/td>\n<td><code>null<\/code><\/td>\n<td><code>String<\/code><\/td>\n<td>\u6811\u4e3b\u5bb9\u5668\u5143\u7d20\u7684\u6837\u5f0f\u3002<\/td>\n<\/tr>\n<tr>\n<td><code>styleClass<\/code><\/td>\n<td><code>null<\/code><\/td>\n<td><code>String<\/code><\/td>\n<td>\u6811\u4e3b\u5bb9\u5668\u5143\u7d20\u7684\u6837\u5f0f\u7c7b\u3002<\/td>\n<\/tr>\n<tr>\n<td><code>selectionMode<\/code><\/td>\n<td><code>null<\/code><\/td>\n<td><code>String<\/code><\/td>\n<td>\u5b9a\u4e49\u9009\u62e9\u6a21\u5f0f\u3002<\/td>\n<\/tr>\n<tr>\n<td><code>highlight<\/code><\/td>\n<td><code>true<\/code><\/td>\n<td><code>Boolean<\/code><\/td>\n<td>\u542f\u7528\u9009\u62e9\u65f6\uff0c\u9f20\u6807\u60ac\u505c\u5728\u8282\u70b9\u4e0a\u662f\u5426\u9ad8\u4eae\u663e\u793a\u3002<\/td>\n<\/tr>\n<tr>\n<td><code>datakey<\/code><\/td>\n<td><code>null<\/code><\/td>\n<td><code>Object<\/code><\/td>\n<td>\u8282\u70b9\u8868\u793a\u7684\u6570\u636e\u7684\u552f\u4e00\u952e\u3002<\/td>\n<\/tr>\n<tr>\n<td><code>animate<\/code><\/td>\n<td><code>false<\/code><\/td>\n<td><code>Boolean<\/code><\/td>\n<td>\u542f\u7528\u65f6\uff0c\u5207\u6362\u65f6\u663e\u793a\u6ed1\u52a8\u6548\u679c\u3002<\/td>\n<\/tr>\n<tr>\n<td><code>orientation<\/code><\/td>\n<td><code>vertical<\/code><\/td>\n<td><code>String<\/code><\/td>\n<td>\u5e03\u5c40\u65b9\u5411\uff0c\u53ef\u9009\u503c\uff1a<code>vertical<\/code>\uff08\u5782\u76f4\uff09\u6216 <code>horizontal<\/code>\uff08\u6c34\u5e73\uff09\u3002<\/td>\n<\/tr>\n<tr>\n<td><code>propagateSelectionUp<\/code><\/td>\n<td><code>true<\/code><\/td>\n<td><code>Boolean<\/code><\/td>\n<td>\u5728\u590d\u9009\u6846\u6a21\u5f0f\u4e0b\uff0c\u5b9a\u4e49\u5411\u4e0a\u9009\u62e9\u4f20\u64ad\u3002<\/td>\n<\/tr>\n<tr>\n<td><code>propagateSelectionDown<\/code><\/td>\n<td><code>true<\/code><\/td>\n<td><code>Boolean<\/code><\/td>\n<td>\u5728\u590d\u9009\u6846\u6a21\u5f0f\u4e0b\uff0c\u5b9a\u4e49\u5411\u4e0b\u9009\u62e9\u4f20\u64ad\u3002<\/td>\n<\/tr>\n<tr>\n<td><code>dir<\/code><\/td>\n<td><code>ltr<\/code><\/td>\n<td><code>String<\/code><\/td>\n<td>\u5b9a\u4e49\u6587\u672c\u65b9\u5411\uff0c\u6709\u6548\u503c\uff1a<code>ltr<\/code>\uff08\u4ece\u5de6\u5230\u53f3\uff09\u548c <code>rtl<\/code>\uff08\u4ece\u53f3\u5230\u5de6\uff09\u3002<\/td>\n<\/tr>\n<tr>\n<td><code>draggable<\/code><\/td>\n<td><code>false<\/code><\/td>\n<td><code>Boolean<\/code><\/td>\n<td>\u4f7f\u6811\u8282\u70b9\u53ef\u62d6\u52a8\u3002<\/td>\n<\/tr>\n<tr>\n<td><code>droppable<\/code><\/td>\n<td><code>false<\/code><\/td>\n<td><code>Boolean<\/code><\/td>\n<td>\u4f7f\u6811\u53ef\u653e\u7f6e\u3002<\/td>\n<\/tr>\n<tr>\n<td><code>dragdropScope<\/code><\/td>\n<td><code>null<\/code><\/td>\n<td><code>String<\/code><\/td>\n<td>\u4f5c\u7528\u57df\u952e\uff0c\u7528\u4e8e\u5c06\u4e00\u7ec4\u6811\u7ec4\u4ef6\u5206\u7ec4\uff0c\u4ee5\u4fbf\u901a\u8fc7\u62d6\u653e\u4f20\u8f93\u8282\u70b9\u3002<\/td>\n<\/tr>\n<tr>\n<td><code>dragMode<\/code><\/td>\n<td><code>self<\/code><\/td>\n<td><code>String<\/code><\/td>\n<td>\u5b9a\u4e49\u8282\u70b9\u88ab\u62d6\u52a8\u65f6\u7684\u7236\u5b50\u5173\u7cfb\uff0c\u6709\u6548\u503c\uff1a<code>self<\/code>\uff08\u9ed8\u8ba4\uff09\u3001<code>parent<\/code> \u548c <code>ancestor<\/code>\u3002<\/td>\n<\/tr>\n<tr>\n<td><code>dropRestrict<\/code><\/td>\n<td><code>none<\/code><\/td>\n<td><code>String<\/code><\/td>\n<td>\u5b9a\u4e49\u8282\u70b9\u88ab\u653e\u7f6e\u65f6\u7684\u7236\u5b50\u9650\u5236\uff0c\u6709\u6548\u503c\uff1a<code>none<\/code>\uff08\u9ed8\u8ba4\uff09\u548c <code>sibling<\/code>\u3002<\/td>\n<\/tr>\n<tr>\n<td><code>required<\/code><\/td>\n<td><code>false<\/code><\/td>\n<td><code>Boolean<\/code><\/td>\n<td>\u9009\u62e9\u7684\u9a8c\u8bc1\u7ea6\u675f\u3002<\/td>\n<\/tr>\n<tr>\n<td><code>requiredMessage<\/code><\/td>\n<td><code>null<\/code><\/td>\n<td><code>String<\/code><\/td>\n<td>\u5fc5\u9009\u9009\u62e9\u9a8c\u8bc1\u7684\u6d88\u606f\u3002<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<h2>\u5f00\u59cb\u4f7f\u7528 PrimeFaces Tree<\/h2>\n<p>\u8fd9\u662f\u6587\u7ae0\u300aPrimefaces \u6811(Tree)\u3001\u6811\u8282\u70b9(TreeNode)\u3001\u6811\u8868(TreeTable) \u793a\u4f8b\u6559\u7a0b\u300b\u7684\u7b2c2\u90e8\u5206\uff08\u517113\u90e8\u5206\uff09\u3002<\/p>\n<p>\u5185\u5bb9\u7247\u6bb5\uff1a\u8be5\u6811\u7531\u4e00\u4e2a<code>org.primefaces.model.TreeNode<\/code>\u5b9e\u4f8b\u586b\u5145\uff0c\u8be5\u5b9e\u4f8b\u5bf9\u5e94\u4e8e\u6839\u8282\u70b9\u3002\u4ee5\u4e0b\u662f\u4e00\u4e2a\u7b80\u5355\u7684\u793a\u4f8b\uff0c\u5c55\u793a\u4e86\u5982\u4f55\u4f7f\u7528Tree\u7ec4\u4ef6\u3002<\/p>\n<h3>index.xhtml \u4ee3\u7801\uff1a<\/h3>\n<pre class=\"post-pre\"><code>&lt;html xmlns=\"https:\/\/www.w3.org\/1999\/xhtml\"\r\n\txmlns:ui=\"https:\/\/java.sun.com\/jsf\/facelets\"\r\n\txmlns:h=\"https:\/\/java.sun.com\/jsf\/html\"\r\n\txmlns:f=\"https:\/\/java.sun.com\/jsf\/core\"\r\n\txmlns:p=\"https:\/\/primefaces.org\/ui\"&gt;\r\n&lt;h:head&gt;\r\n\t&lt;script name=\"jquery\/jquery.js\" library=\"primefaces\"&gt;&lt;\/script&gt;\r\n&lt;\/h:head&gt;\r\n&lt;h:form&gt;\r\n\t&lt;p:tree value=\"#{treeManagedBean.root}\" var=\"node\"&gt;\r\n\t\t&lt;p:treeNode&gt;\r\n\t\t\t&lt;h:outputText value=\"#{node}\"\/&gt;\r\n\t\t&lt;\/p:treeNode&gt;\r\n\t&lt;\/p:tree&gt;\r\n&lt;\/h:form&gt;\r\n&lt;\/html&gt;\r\n<\/code><\/pre>\n<pre class=\"post-pre\"><code>package com.Olivia.prime.faces.beans;\r\n\r\nimport javax.faces.bean.ManagedBean;\r\nimport javax.faces.bean.SessionScoped;\r\n\r\nimport org.primefaces.model.DefaultTreeNode;\r\nimport org.primefaces.model.TreeNode;\r\n\r\n@ManagedBean\r\n@SessionScoped\r\npublic class TreeManagedBean {\r\n\t\/\/ TreeNode \u5b9e\u4f8b\r\n\tprivate TreeNode root;\r\n\r\n\tpublic TreeManagedBean(){\r\n\t\t\/\/ \u8fd9\u662f\u6839\u8282\u70b9\uff0c\u5176\u6570\u636e\u4e3a\u201cRoot Node\u201d\uff0c\u7236\u8282\u70b9\u4e3a null\r\n\t\tthis.root = new DefaultTreeNode(\"Root Node\", null);\r\n\t\t\/\/ \u521b\u5efa\u5b50\u8282\u70b9\r\n\t\tTreeNode child = new DefaultTreeNode(\"Child Node\", this.root);\r\n\t\t\/\/ \u5f15\u7528\u5b50\u8282\u70b9\u7684\u7236\u8282\u70b9\r\n\t\tchild.setParent(this.root);\r\n\t\t\/\/ \u521b\u5efa\u540e\u4ee3\u8282\u70b9\r\n\t\tTreeNode descendent = new DefaultTreeNode(\"Descendent Node\", child);\r\n\t\t\/\/ \u5f15\u7528\u540e\u4ee3\u8282\u70b9\u7684\u7236\u8282\u70b9\r\n\t\tdescendent.setParent(child);\r\n\t}\r\n\r\n\tpublic TreeNode getRoot() {\r\n\t\treturn root;\r\n\t}\r\n\r\n\tpublic void setRoot(TreeNode root) {\r\n\t\tthis.root = root;\r\n\t}\r\n}\r\n<\/code><\/pre>\n<p>\u4ee5\u4e0b\u662f\u5bf9\u4e0a\u8ff0\u4ee3\u7801\u7684\u8fdb\u4e00\u6b65\u89e3\u91ca\uff1a<\/p>\n<ul class=\"post-ul\">\n<li>Tree\u7ec4\u4ef6\u4e0e\u4e00\u4e2a\u540d\u4e3a<code>root<\/code>\u7684<code>TreeNode<\/code>\u5b9e\u4f8b\u5173\u8054\u3002<\/li>\n<li><code>root<\/code>\u5b9e\u4f8b\u4e5f\u6709\u4e00\u4e2a\u4f5c\u4e3a<code>TreeNode<\/code>\u5b9e\u4f8b\u7684\u5b50\u8282\u70b9\uff0c\u8be5\u5b50\u8282\u70b9\u4e5f\u5f15\u7528\u5176\u5b50\u8282\u70b9\u3002<\/li>\n<li>\u8fd9\u79cd\u5c42\u7ea7\u89c6\u56fe\u901a\u8fc7\u76f4\u63a5\u4f7f\u7528<code>value<\/code>\u5c5e\u6027\u5f15\u7528\u6839\u8282\u70b9\u6765\u663e\u793a\u3002<\/li>\n<li><code>var<\/code>\u5c5e\u6027\u7531Tree\u7ec4\u4ef6\u7528\u4e8e\u5f15\u7528\u8bf7\u6c42\u4f5c\u7528\u57df\u53d8\u91cf\uff0c\u8be5\u53d8\u91cf\u5c06\u7528\u4e8e\u5f15\u7528\u6bcf\u4e2a\u6811\u8282\u70b9\u7684\u6570\u636e\u3002<\/li>\n<li>\u6bcf\u4e2a<code>TreeNode<\/code>\u90fd\u662f\u901a\u8fc7\u4f20\u9012\u4e24\u4e2a\u53c2\u6570\u521b\u5efa\u7684\uff1a\u5c01\u88c5\u7684\u6570\u636e\u5bf9\u8c61\u5b9e\u4f8b\u548c\u7236\u8282\u70b9\u5f15\u7528\u3002<\/li>\n<li>\u6bcf\u4e2a<code>TreeNode<\/code>\u7684\u5c5e\u6027\u5305\u62ec\uff1a\u7c7b\u578b\uff08type\uff09\u3001\u6570\u636e\uff08data\uff09\u3001\u5b50\u8282\u70b9\uff08children\uff09\u3001\u7236\u8282\u70b9\uff08parent\uff09\u548c\u5c55\u5f00\u5e03\u5c14\u6307\u793a\u5668\uff08expanded boolean indicator\uff09\u3002\u6240\u6709\u8fd9\u4e9b\u5c5e\u6027\u5c06\u5728\u63a5\u4e0b\u6765\u7684\u7ae0\u8282\u4e2d\u8be6\u7ec6\u63a2\u8ba8\u3002<\/li>\n<\/ul>\n<h2>Primefaces \u52a8\u6001\u6811<\/h2>\n<p>\u6811\u5f62\u7ec4\u4ef6\u9ed8\u8ba4\u60c5\u51b5\u4e0b\u4e0d\u662f\u52a8\u6001\u7684\u3002\u52a8\u6001\u6a21\u5f0f\u4f7f\u7528Ajax\u4ece\u670d\u52a1\u5668\u7aef\u6309\u9700\u83b7\u53d6\u6811\u8282\u70b9\u3002\u5f53\u8282\u70b9\u5c55\u5f00\u65f6\uff0c\u6811\u4f1a\u52a0\u8f7d\u7279\u5b9a\u5c55\u5f00\u8282\u70b9\u7684\u5b50\u8282\u70b9\u5e76\u53d1\u9001\u7ed9\u5ba2\u6237\u7aef\u8fdb\u884c\u663e\u793a\u3002\u4e0e\u5c06\u5207\u6362\u8bbe\u7f6e\u4e3a\u5ba2\u6237\u7aef\u65f6\uff08\u6a21\u578b\u4e2d\u7684\u6240\u6709\u6811\u8282\u70b9\u90fd\u4f1a\u6e32\u67d3\u5230\u5ba2\u6237\u7aef\u5e76\u521b\u5efa\u6811\uff09\u4e0d\u540c\uff0c\u5bf9\u4e8e\u5927\u89c4\u6a21\u6570\u636e\uff0c\u52a8\u6001\u6a21\u5f0f\u6bd4\u4f7f\u7528\u9ed8\u8ba4\u884c\u4e3a\u66f4\u5408\u9002\u3002\u4ee5\u4e0b\u662f\u8bc6\u522b\u52a8\u6001\u5c5e\u6027\u7684\u65b9\u6cd5\u3002<\/p>\n<h3>index.xhtml \u4ee3\u7801\uff1a<\/h3>\n<pre class=\"post-pre\"><code>&lt;html xmlns=\"https:\/\/www.w3.org\/1999\/xhtml\"\r\n\txmlns:ui=\"https:\/\/java.sun.com\/jsf\/facelets\"\r\n\txmlns:h=\"https:\/\/java.sun.com\/jsf\/html\"\r\n\txmlns:f=\"https:\/\/java.sun.com\/jsf\/core\"\r\n\txmlns:p=\"https:\/\/primefaces.org\/ui\"&gt;\r\n&lt;h:head&gt;\r\n\t&lt;script name=\"jquery\/jquery.js\" library=\"primefaces\"&gt;&lt;\/script&gt;\r\n&lt;\/h:head&gt;\r\n&lt;h:form&gt;\r\n\t&lt;p:tree value=\"#{treeManagedBean.root}\" var=\"node\" dynamic=\"true\"&gt;\r\n\t\t&lt;p:treeNode&gt;\r\n\t\t\t&lt;h:outputText value=\"#{node}\"\/&gt;\r\n\t\t&lt;\/p:treeNode&gt;\r\n\t&lt;\/p:tree&gt;\r\n&lt;\/h:form&gt;\r\n&lt;\/html&gt;\r\n<\/code><\/pre>\n<h2>Primefaces\u652f\u6301\u591a\u79cd\u6811\u8282\u70b9\u7c7b\u578b\u3002<\/h2>\n<p>\u4e00\u4e2a\u5e38\u89c1\u7684\u9700\u6c42\u662f\u5728\u5c42\u7ea7\u7ed3\u6784\u4e2d\u62e5\u6709\u4e0d\u540c\u7c7b\u578b\u7684<code>TreeNode<\/code>\u548c\u5bf9\u5e94\u7684\u56fe\u6807\u3002\u4e3a\u4e86\u5b9e\u73b0\u8fd9\u4e00\u70b9\uff0c\u60a8\u5e94\u8be5\u9075\u5faa\u4ee5\u4e0b\u7b80\u5355\u6b65\u9aa4\uff1a<\/p>\n<ul class=\"post-ul\">\n<li>\u5b9a\u4e49\/\u653e\u7f6e\u591a\u4e2a\u7ec4\u4ef6\uff0c\u6bcf\u4e2a\u7ec4\u4ef6\u5177\u6709\u4e0d\u540c\u7684\u7c7b\u578b\u3002<\/li>\n<li>\u4f7f\u7528\u5df2\u5b9a\u4e49\u7684\u7c7b\u578b\u6765\u7ed1\u5b9a\u6a21\u578b\u4e2d\u7684<code>TreeNode<\/code>\u3002<\/li>\n<\/ul>\n<p>\u4ee5\u4e0b\u662f\u4e00\u4e2a\u7b80\u5355\u793a\u4f8b\uff0c\u6f14\u793a\u4e86\u5982\u4f55\u4f7f\u7528\u4e0d\u540c\u7684<code>TreeNode<\/code>\u6765\u5c55\u793a\u7c7b\u578b\u591a\u6837\u6027\u3002\u53d7\u5f71\u54cd\u7684\u6587\u4ef6\u662f<code>index.xhtml<\/code>\u89c6\u56fe\u6587\u4ef6\u548c<code>TreeManagedBean.java<\/code>\u6587\u4ef6\u3002<code>index.xhtml<\/code>\u7684\u4ee3\u7801\u5982\u4e0b\uff1a<\/p>\n<pre class=\"post-pre\"><code>&lt;html xmlns=\"https:\/\/www.w3.org\/1999\/xhtml\"\r\n\txmlns:ui=\"https:\/\/java.sun.com\/jsf\/facelets\"\r\n\txmlns:h=\"https:\/\/java.sun.com\/jsf\/html\"\r\n\txmlns:f=\"https:\/\/java.sun.com\/jsf\/core\"\r\n\txmlns:p=\"https:\/\/primefaces.org\/ui\"&gt;\r\n&lt;h:head&gt;\r\n\t&lt;script name=\"jquery\/jquery.js\" library=\"primefaces\"&gt;&lt;\/script&gt;\r\n&lt;\/h:head&gt;\r\n&lt;h:form&gt;\r\n\t&lt;p:tree value=\"#{treeManagedBean.root}\" var=\"node\" dynamic=\"true\"&gt;\r\n\t\t&lt;p:treeNode expandedIcon=\"ui-icon ui-icon-folder-open\"\r\n\t\t\t\t\t\tcollapsedIcon=\"ui-icon ui-icon-folder-collapsed\"&gt;\r\n\t\t\t&lt;h:outputText value=\"#{node}\"\/&gt;\r\n\t\t&lt;\/p:treeNode&gt;\r\n\t\t&lt;p:treeNode type=\"document\" icon=\"ui-icon ui-icon-document\"&gt;\r\n\t\t\t&lt;h:outputText value=\"#{node}\"\/&gt;\r\n\t\t&lt;\/p:treeNode&gt;\r\n\t\t&lt;p:treeNode type=\"image\" icon=\"ui-icon ui-icon-image\"&gt;\r\n\t\t\t&lt;h:outputText value=\"#{node}\"\/&gt;\r\n\t\t&lt;\/p:treeNode&gt;\r\n\t\t&lt;p:treeNode type=\"video\" icon=\"ui-icon ui-icon-video\"&gt;\r\n\t\t\t&lt;h:outputText value=\"#{node}\"\/&gt;\r\n\t\t&lt;\/p:treeNode&gt;\r\n\t&lt;\/p:tree&gt;\r\n&lt;\/h:form&gt;\r\n&lt;\/html&gt;\r\n<\/code><\/pre>\n<pre class=\"post-pre\"><code>package com.Olivia.prime.faces.beans;\r\n\r\nimport javax.faces.bean.ManagedBean;\r\nimport javax.faces.bean.SessionScoped;\r\n\r\nimport org.primefaces.model.DefaultTreeNode;\r\nimport org.primefaces.model.TreeNode;\r\n\r\n@ManagedBean\r\n@SessionScoped\r\npublic class TreeManagedBean {\r\n\t\/\/ TreeNode \u5b9e\u4f8b\r\n\tprivate TreeNode root;\r\n\r\n\tpublic TreeManagedBean(){\r\n\t\t\/\/ \u8fd9\u662f\u6839\u8282\u70b9\uff0c\u56e0\u6b64\u5176\u6570\u636e\u4e3a\u201cRoot Node\u201d\uff0c\u7236\u8282\u70b9\u4e3a null\r\n\t\tthis.root = new DefaultTreeNode(\"Root Node\", null);\r\n\t\t\/\/ \u521b\u5efa\u6587\u6863\u8282\u70b9\r\n\t\tTreeNode documents = new DefaultTreeNode(\"Documents\", this.root);\r\n\t\t\/\/ \u521b\u5efa\u5355\u4e2a\u6587\u6863\u8282\u70b9\r\n\t\tTreeNode document01 = new DefaultTreeNode(\"document\",\"Expenses.doc\", documents);\r\n\t\t\/\/ \u521b\u5efa\u56fe\u7247\u8282\u70b9\r\n\t\tTreeNode images = new DefaultTreeNode(\"Images\", this.root);\r\n\t\t\/\/ \u521b\u5efa\u5355\u4e2a\u56fe\u7247\u8282\u70b9\r\n\t\tTreeNode image01 = new DefaultTreeNode(\"image\",\"Travel.gif\", images);\r\n\t\t\/\/ \u521b\u5efa\u89c6\u9891\u8282\u70b9\r\n\t\tTreeNode videos = new DefaultTreeNode(\"Videos\", this.root);\r\n\t\t\/\/ \u521b\u5efa\u5355\u4e2a\u89c6\u9891\u8282\u70b9\r\n\t\tTreeNode video01 = new DefaultTreeNode(\"video\",\"Play.avi\", videos);\r\n\t}\r\n\r\n\tpublic TreeNode getRoot() {\r\n\t\treturn root;\r\n\t}\r\n\r\n\tpublic void setRoot(TreeNode root) {\r\n\t\tthis.root = root;\r\n\t}\r\n}\r\n<\/code><\/pre>\n<p>\u4ece\u63d0\u4f9b\u7684\u6f14\u793a\u4e2d\u53ef\u4ee5\u660e\u663e\u770b\u51fa\uff0c<code>TreeNode<\/code>\u5b9e\u4f8b\u548c<code>p:treeNode<\/code>\u7ec4\u4ef6\u4e4b\u95f4\u7684\u96c6\u6210\u662f\u901a\u8fc7<code>type<\/code>\u5c5e\u6027\u5b9e\u73b0\u7684\u3002<\/p>\n<h2>PrimeFaces \u6811\u72b6\u56fe\u7684 Ajax \u884c\u4e3a\u4e8b\u4ef6<\/h2>\n<p>\u6811\u5f62\u63a7\u4ef6\u63d0\u4f9b\u4e86\u591a\u79cd\u4e0d\u540c\u7684 Ajax \u884c\u4e3a\u4e8b\u4ef6\uff1a<\/p>\n<div class=\"post-table\">\n<table>\n<thead>\n<tr>\n<th>\u4e8b\u4ef6 (Event)<\/th>\n<th>\u76d1\u542c\u5668\u53c2\u6570 (Listener Parameter)<\/th>\n<th>\u89e6\u53d1\u65f6\u673a (Fired)<\/th>\n<\/tr>\n<\/thead>\n<tbody>\n<tr>\n<td><code>expand<\/code><\/td>\n<td><code>org.primefaces.event.NodeExpandEvent<\/code><\/td>\n<td>\u5f53\u8282\u70b9\u5c55\u5f00\u65f6\u89e6\u53d1\u3002<\/td>\n<\/tr>\n<tr>\n<td><code>collapse<\/code><\/td>\n<td><code>org.primefaces.event.NodeCollapseEvent<\/code><\/td>\n<td>\u5f53\u8282\u70b9\u6298\u53e0\u65f6\u89e6\u53d1\u3002<\/td>\n<\/tr>\n<tr>\n<td><code>select<\/code><\/td>\n<td><code>org.primefaces.event.NodeSelectEvent<\/code><\/td>\n<td>\u5f53\u8282\u70b9\u88ab\u9009\u4e2d\u65f6\u89e6\u53d1\u3002<\/td>\n<\/tr>\n<tr>\n<td><code>unselect<\/code><\/td>\n<td><code>org.primefaces.event.NodeUnselectEvent<\/code><\/td>\n<td>\u5f53\u8282\u70b9\u88ab\u53d6\u6d88\u9009\u4e2d\u65f6\u89e6\u53d1\u3002<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<h3>PrimeFaces \u6811\u7ec4\u4ef6\u4e8b\u4ef6\u76d1\u542c\u5668\u793a\u4f8b\uff1aindex2.xhtml \u4ee3\u7801\u89e3\u6790<\/h3>\n<p>\u4ee5\u4e0b PrimeFaces \u6811\u7ec4\u4ef6\u914d\u7f6e\u4e86\u56db\u4e2a\u4e8b\u4ef6\u76d1\u542c\u5668\uff1a<\/p>\n<pre class=\"post-pre\"><code>&lt;html xmlns=\"https:\/\/www.w3.org\/1999\/xhtml\"\r\n\txmlns:ui=\"https:\/\/java.sun.com\/jsf\/facelets\"\r\n\txmlns:h=\"https:\/\/java.sun.com\/jsf\/html\"\r\n\txmlns:f=\"https:\/\/java.sun.com\/jsf\/core\"\r\n\txmlns:p=\"https:\/\/primefaces.org\/ui\"&gt;\r\n&lt;h:head&gt;\r\n\t&lt;script name=\"jquery\/jquery.js\" library=\"primefaces\"&gt;&lt;\/script&gt;\r\n&lt;\/h:head&gt;\r\n&lt;h:form&gt;\r\n\t&lt;p:tree value=\"#{treeManagedBean.root}\" var=\"node\" dynamic=\"true\"&gt;\r\n\t\t&lt;p:treeNode expandedIcon=\"ui-icon ui-icon-folder-open\"\r\n\t\t\t\t\t\tcollapsedIcon=\"ui-icon ui-icon-folder-collapsed\"&gt;\r\n\t\t\t&lt;h:outputText value=\"#{node}\"\/&gt;\r\n\t\t&lt;\/p:treeNode&gt;\r\n\t\t&lt;p:treeNode type=\"document\" icon=\"ui-icon ui-icon-document\"&gt;\r\n\t\t\t&lt;h:outputText value=\"#{node}\"\/&gt;\r\n\t\t&lt;\/p:treeNode&gt;\r\n\t\t&lt;p:treeNode type=\"image\" icon=\"ui-icon ui-icon-image\"&gt;\r\n\t\t\t&lt;h:outputText value=\"#{node}\"\/&gt;\r\n\t\t&lt;\/p:treeNode&gt;\r\n\t\t&lt;p:treeNode type=\"video\" icon=\"ui-icon ui-icon-video\"&gt;\r\n\t\t\t&lt;h:outputText value=\"#{node}\"\/&gt;\r\n\t\t&lt;\/p:treeNode&gt;\r\n\t\t&lt;p:ajax event=\"select\" listener=\"#{treeManagedBean.onNodeSelect}\"&gt;&lt;\/p:ajax&gt;\r\n\t\t&lt;p:ajax event=\"unselect\" listener=\"#{treeManagedBean.onNodeUnSelect}\"&gt;&lt;\/p:ajax&gt;\r\n\t\t&lt;p:ajax event=\"expand\" listener=\"#{treeManagedBean.onNodeExpand}\"&gt;&lt;\/p:ajax&gt;\r\n\t\t&lt;p:ajax event=\"collapse\" listener=\"#{treeManagedBean.onNodeCollapse}\"&gt;&lt;\/p:ajax&gt;\r\n\t&lt;\/p:tree&gt;\r\n&lt;\/h:form&gt;\r\n&lt;\/html&gt;\r\n<\/code><\/pre>\n<pre class=\"post-pre\"><code>package com.Olivia.prime.faces.beans;\r\n\r\nimport javax.faces.bean.ManagedBean;\r\nimport javax.faces.bean.SessionScoped;\r\n\r\nimport org.primefaces.event.NodeCollapseEvent;\r\nimport org.primefaces.event.NodeExpandEvent;\r\nimport org.primefaces.event.NodeSelectEvent;\r\nimport org.primefaces.event.NodeUnselectEvent;\r\nimport org.primefaces.model.DefaultTreeNode;\r\nimport org.primefaces.model.TreeNode;\r\n\r\n@ManagedBean\r\n@SessionScoped\r\npublic class TreeManagedBean {\r\n\t\/\/ TreeNode \u5b9e\u4f8b\r\n\tprivate TreeNode root;\r\n\r\n\tpublic TreeManagedBean(){\r\n\t\t\/\/ \u8fd9\u662f\u6839\u8282\u70b9\uff0c\u5176\u6570\u636e\u4e3a\u201cRoot Node\u201d\uff0c\u7236\u8282\u70b9\u4e3a null\r\n\t\tthis.root = new DefaultTreeNode(\"Root Node\", null);\r\n\t\t\/\/ \u521b\u5efa\u6587\u6863\u8282\u70b9\r\n\t\tTreeNode documents = new DefaultTreeNode(\"Documents\", this.root);\r\n\t\t\/\/ \u521b\u5efa\u5355\u4e2a\u6587\u6863\u8282\u70b9\r\n\t\tTreeNode document01 = new DefaultTreeNode(\"document\",\"Expenses.doc\", documents);\r\n\t\t\/\/ \u521b\u5efa\u56fe\u7247\u8282\u70b9\r\n\t\tTreeNode images = new DefaultTreeNode(\"Images\", this.root);\r\n\t\t\/\/ \u521b\u5efa\u5355\u4e2a\u56fe\u7247\u8282\u70b9\r\n\t\tTreeNode image01 = new DefaultTreeNode(\"image\",\"Travel.gif\", images);\r\n\t\t\/\/ \u521b\u5efa\u89c6\u9891\u8282\u70b9\r\n\t\tTreeNode videos = new DefaultTreeNode(\"Videos\", this.root);\r\n\t\t\/\/ \u521b\u5efa\u5355\u4e2a\u89c6\u9891\u8282\u70b9\r\n\t\tTreeNode video01 = new DefaultTreeNode(\"video\",\"Play.avi\", videos);\r\n\t}\r\n\r\n\tpublic TreeNode getRoot() {\r\n\t\treturn root;\r\n\t}\r\n\r\n\tpublic void setRoot(TreeNode root) {\r\n\t\tthis.root = root;\r\n\t}\r\n\r\n\tpublic void onNodeSelect(NodeSelectEvent event){\r\n\t\tSystem.out.println(\"\u8282\u70b9\u6570\u636e ::\"+event.getTreeNode().getData()+\" :: \u5df2\u9009\u4e2d\");\r\n\t}\r\n\r\n\tpublic void onNodeUnSelect(NodeUnselectEvent event){\r\n\t\tSystem.out.println(\"\u8282\u70b9\u6570\u636e ::\"+event.getTreeNode().getData()+\" :: \u5df2\u53d6\u6d88\u9009\u4e2d\");\r\n\t}\r\n\r\n\tpublic void onNodeExpand(NodeExpandEvent event){\r\n\t\tSystem.out.println(\"\u8282\u70b9\u6570\u636e ::\"+event.getTreeNode().getData()+\" :: \u5df2\u5c55\u5f00\");\r\n\t}\r\n\r\n\tpublic void onNodeCollapse(NodeCollapseEvent event){\r\n\t\tSystem.out.println(\"\u8282\u70b9\u6570\u636e ::\"+event.getTreeNode().getData()+\" :: \u5df2\u6298\u53e0\");\r\n\t}\r\n}\r\n<\/code><\/pre>\n<h3>PrimeFaces \u6811\u7ec4\u4ef6\u4e8b\u4ef6\u76d1\u542c\u5668\u8bf4\u660e<\/h3>\n<ul class=\"post-ul\">\n<li>\u5f53\u60a8\u5c55\u5f00\u6216\u6298\u53e0\u6811\u8282\u70b9\uff08TreeNode\uff09\u65f6\uff0c\u4f1a\u89e6\u53d1\u76f8\u5e94\u7684 Ajax \u4e8b\u4ef6\u3002<\/li>\n<li>\u5bf9\u4e8e\u6bcf\u4e2a\u89e6\u53d1\u7684\u4e8b\u4ef6\uff0c\u90fd\u5b9a\u4e49\u4e86\u4e00\u4e2a Ajax \u76d1\u542c\u5668\u65b9\u6cd5\uff08listener method\uff09\u6765\u5904\u7406\u3002<\/li>\n<li>\u4e8b\u4ef6\u76d1\u542c\u5668\u5728\u5904\u7406\u5927\u91cf\u6570\u636e\u65f6\u4e5f\u7279\u522b\u6709\u7528\u3002\u901a\u8fc7\u4e3a\u6811\u63d0\u4f9b\u6839\u8282\u70b9\u548c\u5b50\u8282\u70b9\uff0c\u53ef\u4ee5\u4f7f\u7528\u4e8b\u4ef6\u76d1\u542c\u5668\u5728\u8fd0\u884c\u65f6\u83b7\u53d6\u9009\u5b9a\u7684\u8282\u70b9\u5e76\u5411\u8be5\u7279\u5b9a\u6811\u6dfb\u52a0\u65b0\u8282\u70b9\u3002<\/li>\n<li>\u8bf7\u6ce8\u610f\uff0c\u672c\u793a\u4f8b\u4e2d\u201c\u9009\u62e9\u201d\uff08select\uff09\u548c\u201c\u53d6\u6d88\u9009\u62e9\u201d\uff08unselect\uff09\u4e8b\u4ef6\u76ee\u524d\u4e0d\u4f1a\u89e6\u53d1\uff0c\u8981\u89e6\u53d1\u8fd9\u4e9b\u4e8b\u4ef6\u9700\u8981\u8bbe\u7f6e\u6811\u7684 <code>selectionMode<\/code> \u5c5e\u6027\u3002<\/li>\n<\/ul>\n<h2>PrimeFaces \u6811\u7ec4\u4ef6\uff1a\u8282\u70b9\u9009\u62e9\u4e0e\u4e8b\u4ef6\u5904\u7406\u8be6\u89e3<\/h2>\n<p>\u8fd9\u662f\u6587\u7ae0\u300aPrimeFaces \u6811(Tree)\u3001\u6811\u8282\u70b9(TreeNode)\u3001\u6811\u8868(TreeTable) \u793a\u4f8b\u6559\u7a0b\u300b\u7684\u7b2c5\u90e8\u5206\uff08\u517113\u90e8\u5206\uff09\u3002<\/p>\n<p>PrimeFaces \u6811\u7ec4\u4ef6\u5185\u7f6e\u4e86\u5f3a\u5927\u7684\u8282\u70b9\u9009\u62e9\u529f\u80fd\uff0c\u5e2e\u52a9\u60a8\u8f7b\u677e\u8bc6\u522b\u7528\u6237\u9009\u4e2d\u7684\u8282\u70b9\u3002\u8282\u70b9\u9009\u62e9\u673a\u5236\u652f\u6301\u4e09\u79cd\u6a21\u5f0f\uff0c\u6bcf\u79cd\u6a21\u5f0f\u90fd\u5bf9\u5e94\u7740\u4e0d\u540c\u7684\u9009\u62e9\u5f15\u7528\u7c7b\u578b\uff1a<\/p>\n<ul>\n<li><strong>\u5355\u9009\u6a21\u5f0f (Single Mode):<\/strong> \u6bcf\u6b21\u53ea\u80fd\u9009\u62e9\u4e00\u4e2a\u6811\u8282\u70b9\u3002\u9009\u4e2d\u7684\u8282\u70b9\u5c06\u4f5c\u4e3a\u5355\u4e2a <code>TreeNode<\/code> \u5b9e\u4f8b\u8fdb\u884c\u5f15\u7528\u3002<\/li>\n<li><strong>\u591a\u9009\u6a21\u5f0f (Multiple Mode):<\/strong> \u53ef\u4ee5\u540c\u65f6\u9009\u62e9\u591a\u4e2a\u8282\u70b9\u3002\u9009\u4e2d\u7684\u8282\u70b9\u5c06\u4f5c\u4e3a <code>TreeNode<\/code> \u6570\u7ec4\u8fdb\u884c\u5f15\u7528\u3002<\/li>\n<li><strong>\u590d\u9009\u6846\u6a21\u5f0f (Checkbox Mode):<\/strong> \u901a\u8fc7\u590d\u9009\u6846\u7528\u6237\u754c\u9762\u9009\u62e9\u591a\u4e2a\u8282\u70b9\u3002\u9009\u4e2d\u7684\u8282\u70b9\u540c\u6837\u4f5c\u4e3a <code>TreeNode<\/code> \u6570\u7ec4\u8fdb\u884c\u5f15\u7528\u3002<\/li>\n<\/ul>\n<h3>index1.xhtml \u4ee3\u7801\u793a\u4f8b\uff1a<\/h3>\n<pre class=\"post-pre\"><code>&lt;html xmlns=\"https:\/\/www.w3.org\/1999\/xhtml\"\r\n\txmlns:ui=\"https:\/\/java.sun.com\/jsf\/facelets\"\r\n\txmlns:h=\"https:\/\/java.sun.com\/jsf\/html\"\r\n\txmlns:f=\"https:\/\/java.sun.com\/jsf\/core\"\r\n\txmlns:p=\"https:\/\/primefaces.org\/ui\"&gt;\r\n&lt;h:head&gt;\r\n\t&lt;script name=\"jquery\/jquery.js\" library=\"primefaces\"&gt;&lt;\/script&gt;\r\n&lt;\/h:head&gt;\r\n&lt;h:form&gt;\r\n\t&lt;!-- \u5355\u9009\u6a21\u5f0f\u793a\u4f8b --&gt;\r\n\t&lt;p:tree value=\"#{treeManagedBean.root}\" var=\"node\" dynamic=\"true\"\r\n\t\t\tselectionMode=\"single\" selection=\"#{treeManagedBean.singleSelectedTreeNode}\"&gt;\r\n\t\t&lt;p:treeNode expandedIcon=\"ui-icon ui-icon-folder-open\"\r\n\t\t\t\t\t\tcollapsedIcon=\"ui-icon ui-icon-folder-collapsed\"&gt;\r\n\t\t\t&lt;h:outputText value=\"#{node}\"\/&gt;\r\n\t\t&lt;\/p:treeNode&gt;\r\n\t\t&lt;p:treeNode type=\"document\" icon=\"ui-icon ui-icon-document\"&gt;\r\n\t\t\t&lt;h:outputText value=\"#{node}\"\/&gt;\r\n\t\t&lt;\/p:treeNode&gt;\r\n\t\t&lt;p:treeNode type=\"image\" icon=\"ui-icon ui-icon-image\"&gt;\r\n\t\t\t&lt;h:outputText value=\"#{node}\"\/&gt;\r\n\t\t&lt;\/p:treeNode&gt;\r\n\t\t&lt;p:treeNode type=\"video\" icon=\"ui-icon ui-icon-video\"&gt;\r\n\t\t\t&lt;h:outputText value=\"#{node}\"\/&gt;\r\n\t\t&lt;\/p:treeNode&gt;\r\n\t\t&lt;p:ajax event=\"select\" listener=\"#{treeManagedBean.onNodeSelect}\"&gt;&lt;\/p:ajax&gt;\r\n\t\t&lt;p:ajax event=\"unselect\" listener=\"#{treeManagedBean.onNodeUnSelect}\"&gt;&lt;\/p:ajax&gt;\r\n\t\t&lt;p:ajax event=\"expand\" listener=\"#{treeManagedBean.onNodeExpand}\"&gt;&lt;\/p:ajax&gt;\r\n\t\t&lt;p:ajax event=\"collapse\" listener=\"#{treeManagedBean.onNodeCollapse}\"&gt;&lt;\/p:ajax&gt;\r\n\t&lt;\/p:tree&gt;\r\n\r\n\t&lt;!-- \u591a\u9009\u6a21\u5f0f\u793a\u4f8b --&gt;\r\n\t&lt;p:tree value=\"#{treeManagedBean.root}\" var=\"node\" dynamic=\"true\"\r\n\t\t\tselectionMode=\"multiple\" selection=\"#{treeManagedBean.multipleSelectedTreeNodes}\"&gt;\r\n\t\t&lt;p:treeNode expandedIcon=\"ui-icon ui-icon-folder-open\"\r\n\t\t\t\t\t\tcollapsedIcon=\"ui-icon ui-icon-folder-collapsed\"&gt;\r\n\t\t\t&lt;h:outputText value=\"#{node}\"\/&gt;\r\n\t\t&lt;\/p:treeNode&gt;\r\n\t\t&lt;p:treeNode type=\"document\" icon=\"ui-icon ui-icon-document\"&gt;\r\n\t\t\t&lt;h:outputText value=\"#{node}\"\/&gt;\r\n\t\t&lt;\/p:treeNode&gt;\r\n\t\t&lt;p:treeNode type=\"image\" icon=\"ui-icon ui-icon-image\"&gt;\r\n\t\t\t&lt;h:outputText value=\"#{node}\"\/&gt;\r\n\t\t&lt;\/p:treeNode&gt;\r\n\t\t&lt;p:treeNode type=\"video\" icon=\"ui-icon ui-icon-video\"&gt;\r\n\t\t\t&lt;h:outputText value=\"#{node}\"\/&gt;\r\n\t\t&lt;\/p:treeNode&gt;\r\n\t\t&lt;p:ajax event=\"select\" listener=\"#{treeManagedBean.onNodeSelect}\"&gt;&lt;\/p:ajax&gt;\r\n\t\t&lt;p:ajax event=\"unselect\" listener=\"#{treeManagedBean.onNodeUnSelect}\"&gt;&lt;\/p:ajax&gt;\r\n\t\t&lt;p:ajax event=\"expand\" listener=\"#{treeManagedBean.onNodeExpand}\"&gt;&lt;\/p:ajax&gt;\r\n\t\t&lt;p:ajax event=\"collapse\" listener=\"#{treeManagedBean.onNodeCollapse}\"&gt;&lt;\/p:ajax&gt;\r\n\t&lt;\/p:tree&gt;\r\n\r\n\t&lt;!-- \u590d\u9009\u6846\u6a21\u5f0f\u793a\u4f8b --&gt;\r\n\t&lt;p:tree value=\"#{treeManagedBean.root}\" var=\"node\" dynamic=\"true\"\r\n\t\t\tselectionMode=\"checkbox\" selection=\"#{treeManagedBean.checkboxSelectedTreeNodes}\"&gt;\r\n\t\t&lt;p:treeNode expandedIcon=\"ui-icon ui-icon-folder-open\"\r\n\t\t\t\t\t\tcollapsedIcon=\"ui-icon ui-icon-folder-collapsed\"&gt;\r\n\t\t\t&lt;h:outputText value=\"#{node}\"\/&gt;\r\n\t\t&lt;\/p:treeNode&gt;\r\n\t\t&lt;p:treeNode type=\"document\" icon=\"ui-icon ui-icon-document\"&gt;\r\n\t\t\t&lt;h:outputText value=\"#{node}\"\/&gt;\r\n\t\t&lt;\/p:treeNode&gt;\r\n\t\t&lt;p:treeNode type=\"image\" icon=\"ui-icon ui-icon-image\"&gt;\r\n\t\t\t&lt;h:outputText value=\"#{node}\"\/&gt;\r\n\t\t&lt;\/p:treeNode&gt;\r\n\t\t&lt;p:treeNode type=\"video\" icon=\"ui-icon ui-icon-video\"&gt;\r\n\t\t\t&lt;h:outputText value=\"#{node}\"\/&gt;\r\n\t\t&lt;\/p:treeNode&gt;\r\n\t\t&lt;p:ajax event=\"select\" listener=\"#{treeManagedBean.onNodeSelect}\"&gt;&lt;\/p:ajax&gt;\r\n\t\t&lt;p:ajax event=\"unselect\" listener=\"#{treeManagedBean.onNodeUnSelect}\"&gt;&lt;\/p:ajax&gt;\r\n\t\t&lt;p:ajax event=\"expand\" listener=\"#{treeManagedBean.onNodeExpand}\"&gt;&lt;\/p:ajax&gt;\r\n\t\t&lt;p:ajax event=\"collapse\" listener=\"#{treeManagedBean.onNodeCollapse}\"&gt;&lt;\/p:ajax&gt;\r\n\t&lt;\/p:tree&gt;\r\n\t&lt;h:commandButton value=\"\u6253\u5370\u9009\u5b9a\u8282\u70b9\" action=\"#{treeManagedBean.printSelectedNodes}\"&gt;&lt;\/h:commandButton&gt;\r\n&lt;\/h:form&gt;\r\n&lt;\/html&gt;<\/code><\/pre>\n<pre class=\"post-pre\"><code>package com.Olivia.prime.faces.beans;\r\n\r\nimport javax.faces.bean.ManagedBean;\r\nimport javax.faces.bean.SessionScoped;\r\n\r\nimport org.primefaces.event.NodeCollapseEvent;\r\nimport org.primefaces.event.NodeExpandEvent;\r\nimport org.primefaces.event.NodeSelectEvent;\r\nimport org.primefaces.event.NodeUnselectEvent;\r\nimport org.primefaces.model.DefaultTreeNode;\r\nimport org.primefaces.model.TreeNode;\r\n\r\n@ManagedBean\r\n@SessionScoped\r\npublic class TreeManagedBean {\r\n\t\/\/ TreeNode \u5b9e\u4f8b\r\n\tprivate TreeNode root;\r\n\tprivate TreeNode singleSelectedTreeNode;\r\n\tprivate TreeNode [] multipleSelectedTreeNodes;\r\n\tprivate TreeNode [] checkboxSelectedTreeNodes;\r\n\r\n\tpublic TreeManagedBean(){\r\n\t\t\/\/ \u8fd9\u662f\u6839\u8282\u70b9\uff0c\u5176\u6570\u636e\u4e3a\u201cRoot Node\u201d\uff0c\u7236\u8282\u70b9\u4e3a null\r\n\t\tthis.root = new DefaultTreeNode(\"Root Node\", null);\r\n\t\t\/\/ \u521b\u5efa\u201c\u6587\u6863\u201d\u8282\u70b9\r\n\t\tTreeNode documents = new DefaultTreeNode(\"Documents\", this.root);\r\n\t\t\/\/ \u521b\u5efa\u6587\u6863\u5b50\u8282\u70b9\r\n\t\tTreeNode document01 = new DefaultTreeNode(\"document\",\"Expenses.doc\", documents);\r\n\t\t\/\/ \u521b\u5efa\u201c\u56fe\u7247\u201d\u8282\u70b9\r\n\t\tTreeNode images = new DefaultTreeNode(\"Images\", this.root);\r\n\t\t\/\/ \u521b\u5efa\u56fe\u7247\u5b50\u8282\u70b9\r\n\t\tTreeNode image01 = new DefaultTreeNode(\"image\",\"Travel.gif\", images);\r\n\t\t\/\/ \u521b\u5efa\u201c\u89c6\u9891\u201d\u8282\u70b9\r\n\t\tTreeNode videos = new DefaultTreeNode(\"Videos\", this.root);\r\n\t\t\/\/ \u521b\u5efa\u89c6\u9891\u5b50\u8282\u70b9\r\n\t\tTreeNode video01 = new DefaultTreeNode(\"video\",\"Play.avi\", videos);\r\n\t}\r\n\r\n\tpublic TreeNode getRoot() {\r\n\t\treturn root;\r\n\t}\r\n\r\n\tpublic void setRoot(TreeNode root) {\r\n\t\tthis.root = root;\r\n\t}\r\n\r\n\tpublic TreeNode getSingleSelectedTreeNode() {\r\n\t\treturn singleSelectedTreeNode;\r\n\t}\r\n\r\n\tpublic void setSingleSelectedTreeNode(TreeNode singleSelectedTreeNode) {\r\n\t\tthis.singleSelectedTreeNode = singleSelectedTreeNode;\r\n\t}\r\n\r\n\tpublic TreeNode[] getMultipleSelectedTreeNodes() {\r\n\t\treturn multipleSelectedTreeNodes;\r\n\t}\r\n\r\n\tpublic void setMultipleSelectedTreeNodes(TreeNode[] multipleSelectedTreeNodes) {\r\n\t\tthis.multipleSelectedTreeNodes = multipleSelectedTreeNodes;\r\n\t}\r\n\r\n\tpublic TreeNode[] getCheckboxSelectedTreeNodes() {\r\n\t\treturn checkboxSelectedTreeNodes;\r\n\t}\r\n\r\n\tpublic void setCheckboxSelectedTreeNodes(TreeNode[] checkboxSelectedTreeNodes) {\r\n\t\tthis.checkboxSelectedTreeNodes = checkboxSelectedTreeNodes;\r\n\t}\r\n\r\n\tpublic void onNodeSelect(NodeSelectEvent event){\r\n\t\tSystem.out.println(\"\u8282\u70b9\u6570\u636e ::\"+event.getTreeNode().getData()+\" :: \u5df2\u9009\u62e9\");\r\n\t}\r\n\r\n\tpublic void onNodeUnSelect(NodeUnselectEvent event){\r\n\t\tSystem.out.println(\"\u8282\u70b9\u6570\u636e ::\"+event.getTreeNode().getData()+\" :: \u5df2\u53d6\u6d88\u9009\u62e9\");\r\n\t}\r\n\r\n\tpublic void onNodeExpand(NodeExpandEvent event){\r\n\t\tSystem.out.println(\"\u8282\u70b9\u6570\u636e ::\"+event.getTreeNode().getData()+\" :: \u5df2\u5c55\u5f00\");\r\n\t}\r\n\r\n\tpublic void onNodeCollapse(NodeCollapseEvent event){\r\n\t\tSystem.out.println(\"\u8282\u70b9\u6570\u636e ::\"+event.getTreeNode().getData()+\" :: \u5df2\u6298\u53e0\");\r\n\t}\r\n\r\n\tpublic String printSelectedNodes(){\r\n\t\tSystem.out.println(\"\u5355\u9009\u8282\u70b9\u4e3a :: \"+this.singleSelectedTreeNode.getData());\r\n\t\tfor(TreeNode n : this.multipleSelectedTreeNodes){\r\n\t\t\tSystem.out.println(\"\u591a\u9009\u8282\u70b9\u4e3a :: \"+n.getData());\r\n\t\t}\r\n\t\tfor(TreeNode n : this.checkboxSelectedTreeNodes){\r\n\t\t\tSystem.out.println(\"\u590d\u9009\u6846\u9009\u62e9\u8282\u70b9\u4e3a :: \"+n.getData());\r\n\t\t}\r\n\t\treturn \"\";\r\n\t}\r\n}\r\n<\/code><\/pre>\n<h3>PrimeFaces \u8282\u70b9\u56fe\u6807\u4e0e\u4e8b\u4ef6\u5904\u7406<\/h3>\n<p>\u5728 PrimeFaces \u7684 <code>TreeNode<\/code> \u7ec4\u4ef6\u4e2d\uff0c\u8fd8\u6709\u4e00\u4e9b\u91cd\u8981\u7684\u5c5e\u6027\u548c\u4e8b\u4ef6\u503c\u5f97\u5173\u6ce8\uff1a<\/p>\n<ul>\n<li><code>TreeNode<\/code> \u7ec4\u4ef6\u63d0\u4f9b\u4e86 <code>expandedIcon<\/code> \u548c <code>collapsedIcon<\/code> \u5c5e\u6027\uff0c\u7528\u4e8e\u6307\u5b9a\u8282\u70b9\u5c55\u5f00\u548c\u6298\u53e0\u72b6\u6001\u4e0b\u7684\u56fe\u6807\u3002<\/li>\n<li><code>TreeNode<\/code> \u7ec4\u4ef6\u8fd8\u5177\u6709 <code>icon<\/code> \u5c5e\u6027\uff0c\u7528\u4e8e\u6307\u5b9a\u8282\u70b9\u81ea\u8eab\u7684\u56fe\u6807\u3002<\/li>\n<\/ul>\n<h3>PrimeFaces \u6811\u7ec4\u4ef6\uff1a\u7f13\u5b58\u3001\u52a8\u6001\u52a0\u8f7d\u4e0e\u8282\u70b9\u70b9\u51fb\u4e8b\u4ef6\u5904\u7406<\/h3>\n<p>\u5728 PrimeFaces \u6811\u7ec4\u4ef6\u4e2d\uff0c\u9ed8\u8ba4\u60c5\u51b5\u4e0b\uff0c\u7f13\u5b58\u5c5e\u6027\u662f\u542f\u7528\u7684\u3002\u8fd9\u610f\u5473\u7740\u52a8\u6001\u52a0\u8f7d\u7684\u8282\u70b9\u4f1a\u4fdd\u7559\u5728\u5185\u5b58\u4e2d\uff0c\u56e0\u6b64\u5f53\u60a8\u91cd\u65b0\u5c55\u5f00\u4e00\u4e2a\u8282\u70b9\u65f6\uff0c\u4e0d\u4f1a\u518d\u6b21\u89e6\u53d1\u670d\u52a1\u5668\u7aef\u8bf7\u6c42\uff0c\u4ece\u800c\u63d0\u5347\u7528\u6237\u4f53\u9a8c\u548c\u6027\u80fd\u3002\u5982\u679c\u60a8\u5c06\u6b64\u7f13\u5b58\u5c5e\u6027\u8bbe\u7f6e\u4e3a <code>false<\/code>\uff0c\u90a3\u4e48\u6298\u53e0\u8282\u70b9\u65f6\u5176\u5b50\u8282\u70b9\u5c06\u88ab\u79fb\u9664\u3002\u5f53\u60a8\u7a0d\u540e\u518d\u6b21\u5c55\u5f00\u8be5\u8282\u70b9\u65f6\uff0c\u7cfb\u7edf\u5c06\u4e0d\u5f97\u4e0d\u91cd\u65b0\u4ece\u670d\u52a1\u5668\u83b7\u53d6\u5b50\u8282\u70b9\u6570\u636e\u3002<\/p>\n<p>\u6b64\u5916\uff0cPrimeFaces \u6811\u7ec4\u4ef6\u8fd8\u5141\u8bb8\u60a8\u5728\u8282\u70b9\u88ab\u70b9\u51fb\u65f6\u6267\u884c\u81ea\u5b9a\u4e49\u7684 JavaScript \u4ee3\u7801\u3002\u901a\u8fc7\u4f7f\u7528 <code>onNodeClick<\/code> \u5c5e\u6027\uff0c\u60a8\u53ef\u4ee5\u6307\u5b9a\u4e00\u4e2a JavaScript \u65b9\u6cd5\u3002\u8be5\u65b9\u6cd5\u5728\u88ab\u8c03\u7528\u65f6\uff0c\u4f1a\u63a5\u6536\u5230\u4e24\u4e2a\u53c2\u6570\uff1a\u88ab\u70b9\u51fb\u7684 HTML \u8282\u70b9\u5143\u7d20\u548c\u76f8\u5173\u7684\u4e8b\u4ef6\u5bf9\u8c61\u3002\u4e0b\u9762\u7684\u793a\u4f8b\u5c55\u793a\u4e86\u5982\u4f55\u5728 <code>onNodeClick<\/code> \u65b9\u6cd5\u4e2d\u6253\u5370\u4e00\u4e9b\u65e5\u5fd7\u6d88\u606f\uff0c\u4ee5\u4fbf\u5728\u8282\u70b9\u88ab\u70b9\u51fb\u65f6\u8fdb\u884c\u8c03\u8bd5\u6216\u6267\u884c\u5176\u4ed6\u64cd\u4f5c\u3002<\/p>\n<h4><code>index3.xhtml<\/code> \u4ee3\u7801\u793a\u4f8b\uff1a<\/h4>\n<pre class=\"post-pre\"><code>&lt;html xmlns=\"https:\/\/www.w3.org\/1999\/xhtml\"\r\n\txmlns:ui=\"https:\/\/java.sun.com\/jsf\/facelets\"\r\n\txmlns:h=\"https:\/\/java.sun.com\/jsf\/html\"\r\n\txmlns:f=\"https:\/\/java.sun.com\/jsf\/core\"\r\n\txmlns:p=\"https:\/\/primefaces.org\/ui\"&gt;\r\n&lt;h:head&gt;\r\n\t&lt;script name=\"jquery\/jquery.js\" library=\"primefaces\"&gt;&lt;\/script&gt;\r\n\t&lt;script&gt;\r\n\t\tfunction onNodeClick(node, event) {\r\n\t\t\tconsole.log(\"\u8282\u70b9\u53c2\u6570 :: \" + node);\r\n\t\t\tconsole.log(\"\u4e8b\u4ef6\u53c2\u6570 :: \" + event);\r\n\t\t}\r\n\t&lt;\/script&gt;\r\n&lt;\/h:head&gt;\r\n&lt;h:form&gt;\r\n\t&lt;p:tree value=\"#{treeManagedBean.root}\" var=\"node\" dynamic=\"true\"\r\n\t\t\t\tonNodeClick=\"onNodeClick(node,event)\"\r\n\t\t\t\tselectionMode=\"single\" selection=\"#{treeManagedBean.singleSelectedTreeNode}\"&gt;\r\n\t\t&lt;p:treeNode expandedIcon=\"ui-icon ui-icon-folder-open\"\r\n\t\t\t\t\t\tcollapsedIcon=\"ui-icon ui-icon-folder-collapsed\"&gt;\r\n\t\t\t&lt;h:outputText value=\"#{node}\"\/&gt;\r\n\t\t&lt;\/p:treeNode&gt;\r\n\t\t&lt;p:treeNode type=\"document\" icon=\"ui-icon ui-icon-document\"&gt;\r\n\t\t\t&lt;h:outputText value=\"#{node}\"\/&gt;\r\n\t\t&lt;\/p:treeNode&gt;\r\n\t\t&lt;p:treeNode type=\"image\" icon=\"ui-icon ui-icon-image\"&gt;\r\n\t\t\t&lt;h:outputText value=\"#{node}\"\/&gt;\r\n\t\t&lt;\/p:treeNode&gt;\r\n\t\t&lt;p:treeNode type=\"video\" icon=\"ui-icon ui-icon-video\"&gt;\r\n\t\t\t&lt;h:outputText value=\"#{node}\"\/&gt;\r\n\t\t&lt;\/p:treeNode&gt;\r\n\t\t&lt;p:ajax event=\"select\" listener=\"#{treeManagedBean.onNodeSelect}\"&gt;&lt;\/p:ajax&gt;\r\n\t\t&lt;p:ajax event=\"unselect\" listener=\"#{treeManagedBean.onNodeUnSelect}\"&gt;&lt;\/p:ajax&gt;\r\n\t\t&lt;p:ajax event=\"expand\" listener=\"#{treeManagedBean.onNodeExpand}\"&gt;&lt;\/p:ajax&gt;\r\n\t\t&lt;p:ajax event=\"collapse\" listener=\"#{treeManagedBean.onNodeCollapse}\"&gt;&lt;\/p:ajax&gt;\r\n\t&lt;\/p:tree&gt;\r\n&lt;\/h:form&gt;\r\n&lt;\/html&gt;\r\n<\/code><\/pre>\n<h2>PrimeFaces \u62d6\u653e\u529f\u80fd<\/h2>\n<p>\u8fd9\u662f\u6587\u7ae0\u300aPrimefaces \u6811(Tree)\u3001\u6811\u8282\u70b9(TreeNode)\u3001\u6811\u8868(TreeTable) \u793a\u4f8b\u6559\u7a0b\u300b\u7684\u7b2c7\u90e8\u5206\uff08\u517113\u90e8\u5206\uff09\u3002<\/p>\n<p>\u5185\u5bb9\u7247\u6bb5: \u5355\u4e2a\u6811\u7ed3\u6784\u4e2d\u7684\u6811\u8282\u70b9\u53ef\u4ee5\u91cd\u65b0\u6392\u5e8f\uff0c\u751a\u81f3\u53ef\u4ee5\u4f7f\u7528\u62d6\u653e\u529f\u80fd\u5728\u591a\u4e2a\u6811\u4e4b\u95f4\u8fdb\u884c\u8f6c\u79fb\u3002\u4ee5\u4e0b\u793a\u4f8b\u5411\u60a8\u5c55\u793a\u5982\u4f55\u4f7f\u5355\u4e2a\u6811\u5177\u6709\u53ef\u62d6\u653e\u529f\u80fd\u3002<code>index4.xhtml<\/code> \u4ee3\u7801\u5982\u4e0b\uff1a<\/p>\n<pre class=\"post-pre\"><code>&lt;html xmlns=\"https:\/\/www.w3.org\/1999\/xhtml\"\r\n\txmlns:ui=\"https:\/\/java.sun.com\/jsf\/facelets\"\r\n\txmlns:h=\"https:\/\/java.sun.com\/jsf\/html\"\r\n\txmlns:f=\"https:\/\/java.sun.com\/jsf\/core\"\r\n\txmlns:p=\"https:\/\/primefaces.org\/ui\"&gt;\r\n&lt;h:head&gt;\r\n\t&lt;script name=\"jquery\/jquery.js\" library=\"primefaces\"&gt;&lt;\/script&gt;\r\n&lt;\/h:head&gt;\r\n&lt;h:form&gt;\r\n\t&lt;p:tree value=\"#{treeManagedBean.root}\" var=\"node\" dynamic=\"true\" droppable=\"true\" draggable=\"true\"\r\n\t\t\t\tselectionMode=\"single\" selection=\"#{treeManagedBean.singleSelectedTreeNode}\"&gt;\r\n\t\t&lt;p:treeNode expandedIcon=\"ui-icon ui-icon-folder-open\"\r\n\t\t\t\t\t\tcollapsedIcon=\"ui-icon ui-icon-folder-collapsed\"&gt;\r\n\t\t\t&lt;h:outputText value=\"#{node}\"\/&gt;\r\n\t\t&lt;\/p:treeNode&gt;\r\n\t\t&lt;p:treeNode type=\"document\" icon=\"ui-icon ui-icon-document\"&gt;\r\n\t\t\t&lt;h:outputText value=\"#{node}\"\/&gt;\r\n\t\t&lt;\/p:treeNode&gt;\r\n\t\t&lt;p:treeNode type=\"image\" icon=\"ui-icon ui-icon-image\"&gt;\r\n\t\t\t&lt;h:outputText value=\"#{node}\"\/&gt;\r\n\t\t&lt;\/p:treeNode&gt;\t\t\t\t\t\r\n\t\t&lt;p:treeNode type=\"video\" icon=\"ui-icon ui-icon-video\"&gt;\r\n\t\t\t&lt;h:outputText value=\"#{node}\"\/&gt;\r\n\t\t&lt;\/p:treeNode&gt;\r\n\t\t&lt;p:ajax event=\"select\" listener=\"#{treeManagedBean.onNodeSelect}\"&gt;&lt;\/p:ajax&gt;\r\n\t\t&lt;p:ajax event=\"unselect\" listener=\"#{treeManagedBean.onNodeUnSelect}\"&gt;&lt;\/p:ajax&gt;\r\n\t\t&lt;p:ajax event=\"expand\" listener=\"#{treeManagedBean.onNodeExpand}\"&gt;&lt;\/p:ajax&gt;\r\n\t\t&lt;p:ajax event=\"collapse\" listener=\"#{treeManagedBean.onNodeCollapse}\"&gt;&lt;\/p:ajax&gt;\t\t\t\t\t\t\t\t\r\n\t&lt;\/p:tree&gt;\r\n&lt;\/h:form&gt;\r\n&lt;\/html&gt;\r\n<\/code><\/pre>\n<p>\u5e94\u7528\u62d6\u653e\u6982\u5ff5\u5bf9\u5355\u4e2a\u6811\u8fdb\u884c\u64cd\u4f5c\u975e\u5e38\u7b80\u5355\uff0c\u800c\u5f53\u6d89\u53ca\u5230\u591a\u4e2a\u6811\u7ec4\u4ef6\u7684\u62d6\u653e\u65f6\uff0c\u4f1a\u51fa\u73b0\u66f4\u590d\u6742\u7684\u793a\u4f8b\u3002\u4ee5\u4e0b\u793a\u4f8b\u4e3a\u60a8\u5c55\u793a\u4e86\u4e00\u4e2a\u7b80\u5355\u7684\u591a\u6811\u62d6\u653e\u793a\u4f8b\u3002\u8fd9\u6b21\u9700\u8981\u4f7f\u7528\u4e00\u4e2a\u65b0\u5c5e\u6027 <code>dragdropScope<\/code> \u6765\u4f7f\u6811\u7684\u8282\u70b9\u80fd\u591f\u5728\u5f7c\u6b64\u4e4b\u95f4\u8fdb\u884c\u62d6\u653e\u3002<code>index5.xhtml<\/code> \u4ee3\u7801\u5982\u4e0b\uff1a<\/p>\n<pre class=\"post-pre\"><code>&lt;html xmlns=\"https:\/\/www.w3.org\/1999\/xhtml\"\r\n\txmlns:ui=\"https:\/\/java.sun.com\/jsf\/facelets\"\r\n\txmlns:h=\"https:\/\/java.sun.com\/jsf\/html\"\r\n\txmlns:f=\"https:\/\/java.sun.com\/jsf\/core\"\r\n\txmlns:p=\"https:\/\/primefaces.org\/ui\"&gt;\r\n&lt;h:head&gt;\r\n\t&lt;script name=\"jquery\/jquery.js\" library=\"primefaces\"&gt;&lt;\/script&gt;\r\n&lt;\/h:head&gt;\r\n&lt;h:form&gt;\r\n\t&lt;p:tree value=\"#{treeManagedBean.root}\" var=\"node\" dynamic=\"true\" droppable=\"true\" draggable=\"true\"\r\n\t\t\t\tselectionMode=\"single\" selection=\"#{treeManagedBean.singleSelectedTreeNode}\"\r\n\t\t\t\tdragdropScope=\"myScope\"&gt;\r\n\t\t&lt;p:treeNode expandedIcon=\"ui-icon ui-icon-folder-open\"\r\n\t\t\t\t\t\tcollapsedIcon=\"ui-icon ui-icon-folder-collapsed\"&gt;\r\n\t\t\t&lt;h:outputText value=\"#{node}\"\/&gt;\r\n\t\t&lt;\/p:treeNode&gt;\r\n\t\t&lt;p:treeNode type=\"document\" icon=\"ui-icon ui-icon-document\"&gt;\r\n\t\t\t&lt;h:outputText value=\"#{node}\"\/&gt;\r\n\t\t&lt;\/p:treeNode&gt;\r\n\t\t&lt;p:treeNode type=\"image\" icon=\"ui-icon ui-icon-image\"&gt;\r\n\t\t\t&lt;h:outputText value=\"#{node}\"\/&gt;\r\n\t\t&lt;\/p:treeNode&gt;\t\t\t\t\t\r\n\t\t&lt;p:treeNode type=\"video\" icon=\"ui-icon ui-icon-video\"&gt;\r\n\t\t\t&lt;h:outputText value=\"#{node}\"\/&gt;\r\n\t\t&lt;\/p:treeNode&gt;\r\n\t\t&lt;p:ajax event=\"select\" listener=\"#{treeManagedBean.onNodeSelect}\"&gt;&lt;\/p:ajax&gt;\r\n\t\t&lt;p:ajax event=\"unselect\" listener=\"#{treeManagedBean.onNodeUnSelect}\"&gt;&lt;\/p:ajax&gt;\r\n\t\t&lt;p:ajax event=\"expand\" listener=\"#{treeManagedBean.onNodeExpand}\"&gt;&lt;\/p:ajax&gt;\r\n\t\t&lt;p:ajax event=\"collapse\" listener=\"#{treeManagedBean.onNodeCollapse}\"&gt;&lt;\/p:ajax&gt;\t\t\t\t\t\t\t\t\r\n\t&lt;\/p:tree&gt;\r\n\t\r\n\t&lt;p:tree value=\"#{treeManagedBean.root}\" var=\"node\" dynamic=\"true\" droppable=\"true\" draggable=\"true\"\r\n\t\t\t\tselectionMode=\"single\" selection=\"#{treeManagedBean.singleSelectedTreeNode}\"\r\n\t\t\t\tdragdropScope=\"myScope\"&gt;\r\n\t\t&lt;p:treeNode expandedIcon=\"ui-icon ui-icon-folder-open\"\r\n\t\t\t\t\t\tcollapsedIcon=\"ui-icon ui-icon-folder-collapsed\"&gt;\r\n\t\t\t&lt;h:outputText value=\"#{node}\"\/&gt;\r\n\t\t&lt;\/p:treeNode&gt;\r\n\t\t&lt;p:treeNode type=\"document\" icon=\"ui-icon ui-icon-document\"&gt;\r\n\t\t\t&lt;h:outputText value=\"#{node}\"\/&gt;\r\n\t\t&lt;\/p:treeNode&gt;\r\n\t\t&lt;p:treeNode type=\"image\" icon=\"ui-icon ui-icon-image\"&gt;\r\n\t\t\t&lt;h:outputText value=\"#{node}\"\/&gt;\r\n\t\t&lt;\/p:treeNode&gt;\t\t\t\t\t\r\n\t\t&lt;p:treeNode type=\"video\" icon=\"ui-icon ui-icon-video\"&gt;\r\n\t\t\t&lt;h:outputText value=\"#{node}\"\/&gt;\r\n\t\t&lt;\/p:treeNode&gt;\r\n\t\t&lt;p:ajax event=\"select\" listener=\"#{treeManagedBean.onNodeSelect}\"&gt;&lt;\/p:ajax&gt;\r\n\t\t&lt;p:ajax event=\"unselect\" listener=\"#{treeManagedBean.onNodeUnSelect}\"&gt;&lt;\/p:ajax&gt;\r\n\t\t&lt;p:ajax event=\"expand\" listener=\"#{treeManagedBean.onNodeExpand}\"&gt;&lt;\/p:ajax&gt;\r\n\t\t&lt;p:ajax event=\"collapse\" listener=\"#{treeManagedBean.onNodeCollapse}\"&gt;&lt;\/p:ajax&gt;\t\t\t\t\t\t\t\t\r\n\t&lt;\/p:tree&gt;\t\r\n&lt;\/h:form&gt;\r\n&lt;\/html&gt;\r\n<\/code><\/pre>\n<h2>PrimeFaces \u6811\u7ec4\u4ef6\uff1a\u62d6\u653e\u529f\u80fd\u8be6\u89e3\u4e0e\u793a\u4f8b<\/h2>\n<p>\u8fd9\u662f\u6587\u7ae0\u300aPrimefaces \u6811(Tree)\u3001\u6811\u8282\u70b9(TreeNode)\u3001\u6811\u8868(TreeTable) \u793a\u4f8b\u6559\u7a0b\u300b\u7684\u7b2c8\u90e8\u5206\uff08\u517113\u90e8\u5206\uff09\u3002<\/p>\n<p>PrimeFaces \u6811\u7ec4\u4ef6\u9ed8\u8ba4\u65b9\u5411\u4e3a\u5782\u76f4\u3002\u901a\u8fc7\u8bbe\u7f6e <code>orientation<\/code> \u5c5e\u6027\u4e3a <code>horizontal<\/code>\uff0c\u53ef\u4ee5\u5c06\u6811\u8282\u70b9\u4ee5\u6c34\u5e73\u5e03\u5c40\u663e\u793a\u3002\u9664\u4e86\u62d6\u653e\u529f\u80fd\u5916\uff0c\u5782\u76f4\u6811\u7684\u6240\u6709\u7279\u6027\u5728\u6c34\u5e73\u6811\u4e0a\u540c\u6837\u53ef\u7528\u3002<\/p>\n<p>\u4ee5\u4e0b\u662f <code>index6.xhtml<\/code> \u7684\u4ee3\u7801\u793a\u4f8b\uff1a<\/p>\n<pre class=\"post-pre\"><code>&lt;html xmlns=\"https:\/\/www.w3.org\/1999\/xhtml\"\r\n\txmlns:ui=\"https:\/\/java.sun.com\/jsf\/facelets\"\r\n\txmlns:h=\"https:\/\/java.sun.com\/jsf\/html\"\r\n\txmlns:f=\"https:\/\/java.sun.com\/jsf\/core\"\r\n\txmlns:p=\"https:\/\/primefaces.org\/ui\"&gt;\r\n&lt;h:head&gt;\r\n\t&lt;script name=\"jquery\/jquery.js\" library=\"primefaces\"&gt;&lt;\/script&gt;\r\n&lt;\/h:head&gt;\r\n&lt;h:form&gt;\r\n\t&lt;p:tree value=\"#{treeManagedBean.root}\" var=\"node\" dynamic=\"true\" orientation=\"horizontal\" \r\n\t\t\t\tselectionMode=\"single\" selection=\"#{treeManagedBean.singleSelectedTreeNode}\"&gt;\r\n\t\t&lt;p:treeNode expandedIcon=\"ui-icon ui-icon-folder-open\"\r\n\t\t\t\t\t\tcollapsedIcon=\"ui-icon ui-icon-folder-collapsed\"&gt;\r\n\t\t\t&lt;h:outputText value=\"#{node}\"\/&gt;\r\n\t\t&lt;\/p:treeNode&gt;\r\n\t\t&lt;p:treeNode type=\"document\" icon=\"ui-icon ui-icon-document\"&gt;\r\n\t\t\t&lt;h:outputText value=\"#{node}\"\/&gt;\r\n\t\t&lt;\/p:treeNode&gt;\r\n\t\t&lt;p:treeNode type=\"image\" icon=\"ui-icon ui-icon-image\"&gt;\r\n\t\t\t&lt;h:outputText value=\"#{node}\"\/&gt;\r\n\t\t&lt;\/p:treeNode&gt;\t\t\t\t\t\r\n\t\t&lt;p:treeNode type=\"video\" icon=\"ui-icon ui-icon-video\"&gt;\r\n\t\t\t&lt;h:outputText value=\"#{node}\"\/&gt;\r\n\t\t&lt;\/p:treeNode&gt;\r\n\t\t&lt;p:ajax event=\"select\" listener=\"#{treeManagedBean.onNodeSelect}\"&gt;&lt;\/p:ajax&gt;\r\n\t\t&lt;p:ajax event=\"unselect\" listener=\"#{treeManagedBean.onNodeUnSelect}\"&gt;&lt;\/p:ajax&gt;\r\n\t\t&lt;p:ajax event=\"expand\" listener=\"#{treeManagedBean.onNodeExpand}\"&gt;&lt;\/p:ajax&gt;\r\n\t\t&lt;p:ajax event=\"collapse\" listener=\"#{treeManagedBean.onNodeCollapse}\"&gt;&lt;\/p:ajax&gt;\t\t\t\t\t\t\t\r\n\t&lt;\/p:tree&gt;\r\n&lt;\/h:form&gt;\r\n&lt;\/html&gt;\r\n<\/code><\/pre>\n<h2>PrimeFaces \u4e0a\u4e0b\u6587\u83dc\u5355 (ContextMenu)<\/h2>\n<h2>PrimeFaces \u6811\u5f62\u8868\u683c\uff1a\u4e0a\u4e0b\u6587\u83dc\u5355\u96c6\u6210\u793a\u4f8b<\/h2>\n<p>PrimeFaces \u63d0\u4f9b\u4e86\u4e00\u4e2a\u7279\u6b8a\u7684\u7ec4\u4ef6\uff0c\u7528\u4e8e\u5b9e\u73b0\u4e0a\u4e0b\u6587\u64cd\u4f5c\u3002<code>ContextMenu<\/code> \u7ec4\u4ef6\u6b63\u662f\u4e3a\u6b64\u76ee\u7684\u800c\u8bbe\u8ba1\uff0c\u5e76\u4e14 <code>Tree<\/code> \u7ec4\u4ef6\u751a\u81f3\u53ef\u4ee5\u4e0e\u4e0a\u4e0b\u6587\u83dc\u5355\u65e0\u7f1d\u96c6\u6210\uff0c\u4ee5\u4fbf\u5bf9\u9009\u5b9a\u7684\u8282\u70b9\u6216\u591a\u4e2a\u9009\u62e9\u7684\u8282\u70b9\u5e94\u7528\u6392\u5e8f\u64cd\u4f5c\u3002<\/p>\n<p>\u8981\u5b9e\u73b0\u6b64\u529f\u80fd\uff0c\u5e94\u4f7f\u7528 <code>ContextMenu<\/code> \u7684 <code>for<\/code> \u5c5e\u6027\u6765\u5f15\u7528 <code>Tree<\/code> \u7ec4\u4ef6\u7684 <code>id<\/code> \u5c5e\u6027\u3002\u8fd9\u6837\uff0c\u6bcf\u5f53\u5728 <code>Tree<\/code> \u7ec4\u4ef6\u5185\u9009\u62e9\u7279\u5b9a\u8282\u70b9\u65f6\uff0c\u5c31\u4f1a\u663e\u793a\u9884\u5b9a\u4e49\u7684\u83dc\u5355\u3002\u901a\u8fc7\u53f3\u952e\u5355\u51fb\u5373\u53ef\u663e\u793a\u4e0a\u4e0b\u6587\u83dc\u5355\u7ec4\u4ef6\u3002<\/p>\n<h3>index6.xhtml \u4ee3\u7801\u793a\u4f8b\uff1a<\/h3>\n<pre class=\"post-pre\"><code>&lt;html xmlns=\"https:\/\/www.w3.org\/1999\/xhtml\"\r\n\txmlns:ui=\"https:\/\/java.sun.com\/jsf\/facelets\"\r\n\txmlns:h=\"https:\/\/java.sun.com\/jsf\/html\"\r\n\txmlns:f=\"https:\/\/java.sun.com\/jsf\/core\"\r\n\txmlns:p=\"https:\/\/primefaces.org\/ui\"&gt;\r\n&lt;h:head&gt;\r\n\t&lt;script name=\"jquery\/jquery.js\" library=\"primefaces\"&gt;&lt;\/script&gt;\r\n&lt;\/h:head&gt;\r\n&lt;h:form&gt;\r\n\t&lt;p:contextMenu for=\"tree\"&gt;\r\n\t\t&lt;p:menuitem value=\"\u67e5\u770b\" actionListener=\"#{treeManagedBean.view}\" icon=\"ui-icon-search\"&gt;&lt;\/p:menuitem&gt;\r\n\t&lt;\/p:contextMenu&gt;\r\n\t&lt;p:tree id=\"tree\" value=\"#{treeManagedBean.root}\" var=\"node\" dynamic=\"true\" orientation=\"horizontal\" \r\n\t\t\t\tselectionMode=\"single\" selection=\"#{treeManagedBean.singleSelectedTreeNode}\"&gt;\r\n\t\t&lt;p:treeNode expandedIcon=\"ui-icon ui-icon-folder-open\"\r\n\t\t\t\t\t\tcollapsedIcon=\"ui-icon ui-icon-folder-collapsed\"&gt;\r\n\t\t\t&lt;h:outputText value=\"#{node}\"\/&gt;\r\n\t\t&lt;\/p:treeNode&gt;\r\n\t\t&lt;p:treeNode type=\"document\" icon=\"ui-icon ui-icon-document\"&gt;\r\n\t\t\t&lt;h:outputText value=\"#{node}\"\/&gt;\r\n\t\t&lt;\/p:treeNode&gt;\r\n\t\t&lt;p:treeNode type=\"image\" icon=\"ui-icon ui-icon-image\"&gt;\r\n\t\t\t&lt;h:outputText value=\"#{node}\"\/&gt;\r\n\t\t&lt;\/p:treeNode&gt;\t\t\t\t\t\r\n\t\t&lt;p:treeNode type=\"video\" icon=\"ui-icon ui-icon-video\"&gt;\r\n\t\t\t&lt;h:outputText value=\"#{node}\"\/&gt;\r\n\t\t&lt;\/p:treeNode&gt;\r\n\t\t&lt;p:ajax event=\"select\" listener=\"#{treeManagedBean.onNodeSelect}\"&gt;&lt;\/p:ajax&gt;\r\n\t\t&lt;p:ajax event=\"unselect\" listener=\"#{treeManagedBean.onNodeUnSelect}\"&gt;&lt;\/p:ajax&gt;\r\n\t\t&lt;p:ajax event=\"expand\" listener=\"#{treeManagedBean.onNodeExpand}\"&gt;&lt;\/p:ajax&gt;\r\n\t\t&lt;p:ajax event=\"collapse\" listener=\"#{treeManagedBean.onNodeCollapse}\"&gt;&lt;\/p:ajax&gt;\t\t\t\t\t\t\t\r\n\t&lt;\/p:tree&gt;\r\n&lt;\/h:form&gt;\r\n&lt;\/html&gt;\r\n<\/code><\/pre>\n<h3>TreeManagedBean.java \u4ee3\u7801\u793a\u4f8b\uff1a<\/h3>\n<pre class=\"post-pre\"><code>package com.Olivia.prime.faces.beans;\r\n\r\nimport javax.faces.bean.ManagedBean;\r\nimport javax.faces.bean.SessionScoped;\r\nimport javax.faces.event.ActionEvent;\r\n\r\nimport org.primefaces.event.NodeCollapseEvent;\r\nimport org.primefaces.event.NodeExpandEvent;\r\nimport org.primefaces.event.NodeSelectEvent;\r\nimport org.primefaces.event.NodeUnselectEvent;\r\nimport org.primefaces.model.DefaultTreeNode;\r\nimport org.primefaces.model.TreeNode;\r\n\r\n@ManagedBean\r\n@SessionScoped\r\npublic class TreeManagedBean {\r\n\t\/\/ \u6811\u8282\u70b9\u5b9e\u4f8b\r\n\tprivate TreeNode root;\r\n\tprivate TreeNode singleSelectedTreeNode;\r\n\tprivate TreeNode [] multipleSelectedTreeNodes;\r\n\tprivate TreeNode [] checkboxSelectedTreeNodes;\r\n\t\r\n\tpublic TreeManagedBean(){\r\n\t\t\/\/ \u8fd9\u662f\u6839\u8282\u70b9\uff0c\u5176\u6570\u636e\u4e3a\u201cRoot Node\u201d\uff0c\u7236\u8282\u70b9\u4e3a null\r\n\t\tthis.root = new DefaultTreeNode(\"Root Node\", null);\r\n\t\t\/\/ \u521b\u5efa\u6587\u6863\u8282\u70b9\r\n\t\tTreeNode documents = new DefaultTreeNode(\"Documents\", this.root);\r\n\t\t\/\/ \u521b\u5efa\u6587\u6863\u5b50\u8282\u70b9\r\n\t\tTreeNode document01 = new DefaultTreeNode(\"document\",\"Expenses.doc\", documents);\r\n\t\t\/\/ \u521b\u5efa\u56fe\u7247\u8282\u70b9\r\n\t\tTreeNode images = new DefaultTreeNode(\"Images\", this.root);\r\n\t\t\/\/ \u521b\u5efa\u56fe\u7247\u5b50\u8282\u70b9\r\n\t\tTreeNode image01 = new DefaultTreeNode(\"image\",\"Travel.gif\", images);\r\n\t\t\/\/ \u521b\u5efa\u89c6\u9891\u8282\u70b9\r\n\t\tTreeNode videos = new DefaultTreeNode(\"Videos\", this.root);\r\n\t\t\/\/ \u521b\u5efa\u89c6\u9891\u5b50\u8282\u70b9\r\n\t\tTreeNode video01 = new DefaultTreeNode(\"video\",\"Play.avi\", videos);\r\n\t}\r\n\r\n\tpublic TreeNode getRoot() {\r\n\t\treturn root;\r\n\t}\r\n\r\n\tpublic void setRoot(TreeNode root) {\r\n\t\tthis.root = root;\r\n\t}\r\n\t\r\n\tpublic TreeNode getSingleSelectedTreeNode() {\r\n\t\treturn singleSelectedTreeNode;\r\n\t}\r\n\r\n\tpublic void setSingleSelectedTreeNode(TreeNode singleSelectedTreeNode) {\r\n\t\tthis.singleSelectedTreeNode = singleSelectedTreeNode;\r\n\t}\r\n\r\n\tpublic TreeNode[] getMultipleSelectedTreeNodes() {\r\n\t\treturn multipleSelectedTreeNodes;\r\n\t}\r\n\r\n\tpublic void setMultipleSelectedTreeNodes(TreeNode[] multipleSelectedTreeNodes) {\r\n\t\tthis.multipleSelectedTreeNodes = multipleSelectedTreeNodes;\r\n\t}\r\n\r\n\tpublic TreeNode[] getCheckboxSelectedTreeNodes() {\r\n\t\treturn checkboxSelectedTreeNodes;\r\n\t}\r\n\r\n\tpublic void setCheckboxSelectedTreeNodes(TreeNode[] checkboxSelectedTreeNodes) {\r\n\t\tthis.checkboxSelectedTreeNodes = checkboxSelectedTreeNodes;\r\n\t}\r\n\r\n\tpublic void onNodeSelect(NodeSelectEvent event){\r\n\t\tSystem.out.println(\"\u8282\u70b9\u6570\u636e ::\"+event.getTreeNode().getData()+\" :: \u5df2\u9009\u4e2d\");\r\n\t}\r\n\t\r\n\tpublic void onNodeUnSelect(NodeUnselectEvent event){\r\n\t\tSystem.out.println(\"\u8282\u70b9\u6570\u636e ::\"+event.getTreeNode().getData()+\" :: \u5df2\u53d6\u6d88\u9009\u4e2d\");\r\n\t}\r\n\t\r\n\tpublic void onNodeExpand(NodeExpandEvent event){\r\n\t\tSystem.out.println(\"\u8282\u70b9\u6570\u636e ::\"+event.getTreeNode().getData()+\" :: \u5df2\u5c55\u5f00\");\r\n\t}\r\n\t\r\n\tpublic void onNodeCollapse(NodeCollapseEvent event){\r\n\t\tSystem.out.println(\"\u8282\u70b9\u6570\u636e ::\"+event.getTreeNode().getData()+\" :: \u5df2\u6298\u53e0\");\r\n\t}\r\n\t\r\n\tpublic String printSelectedNodes(){\r\n\t\tSystem.out.println(\"\u5355\u9009\u7ed3\u679c\u4e3a :: \"+this.singleSelectedTreeNode.getData());\r\n\t\tfor(TreeNode n : this.multipleSelectedTreeNodes){\r\n\t\t\tSystem.out.println(\"\u591a\u9009\u7ed3\u679c\u4e3a :: \"+n.getData());\t\r\n\t\t}\r\n\t\tfor(TreeNode n : this.checkboxSelectedTreeNodes){\r\n\t\t\tSystem.out.println(\"\u590d\u9009\u6846\u9009\u62e9\u7ed3\u679c\u4e3a :: \"+n.getData());\t\r\n\t\t}\t\t\r\n\t\treturn \"\";\r\n\t}\r\n\t\r\n\tpublic void view(ActionEvent e){\r\n\t\tSystem.out.println(\"\u9488\u5bf9\u8282\u70b9 :: \"+this.singleSelectedTreeNode.getData()+\" :: \u5df2\u8c03\u7528\u67e5\u770b\u64cd\u4f5c\");\r\n\t}\t\r\n}\r\n<\/code><\/pre>\n<p>TreeTable \u7528\u4e8e\u4ee5\u8868\u683c\u5f62\u5f0f\u663e\u793a\u5206\u5c42\u6570\u636e\u3002<\/p>\n<h2>\u5f00\u59cb\u4f7f\u7528 PrimeFaces TreeTable<\/h2>\n<p>\u5728\u63a2\u7d22 TreeTable \u7ec4\u4ef6\u4e4b\u524d\uff0c\u4e86\u89e3\u5176\u57fa\u672c\u4fe1\u606f\u548c\u5c5e\u6027\u975e\u5e38\u91cd\u8981\u3002<\/p>\n<div>\n<div class=\"post-table\">\n<table>\n<thead>\n<tr>\n<th>\u4fe1\u606f<\/th>\n<th>TreeTable<\/th>\n<\/tr>\n<\/thead>\n<tbody>\n<tr>\n<td>\u7ec4\u4ef6\u7c7b<\/td>\n<td><code>org.primefaces.component.treetable.TreeTable<\/code><\/td>\n<\/tr>\n<tr>\n<td>\u7ec4\u4ef6\u7c7b\u578b<\/td>\n<td><code>org.primefaces.component.TreeTable<\/code><\/td>\n<\/tr>\n<tr>\n<td>\u7ec4\u4ef6\u5bb6\u65cf<\/td>\n<td><code>org.primefaces.component<\/code><\/td>\n<\/tr>\n<tr>\n<td>\u6e32\u67d3\u5668\u7c7b\u578b<\/td>\n<td><code>org.primefaces.component.TreeTableRenderer<\/code><\/td>\n<\/tr>\n<tr>\n<td>\u6e32\u67d3\u5668\u7c7b<\/td>\n<td><code>org.primefaces.component.treetable.TreeTableRenderer<\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table><\/div>\n<div class=\"post-table\">\n<table>\n<thead>\n<tr>\n<th>\u540d\u79f0<\/th>\n<th>\u9ed8\u8ba4\u503c<\/th>\n<th>\u7c7b\u578b<\/th>\n<th>\u63cf\u8ff0<\/th>\n<\/tr>\n<\/thead>\n<tbody>\n<tr>\n<td><code>id<\/code><\/td>\n<td><code>null<\/code><\/td>\n<td><code>String<\/code><\/td>\n<td>\u7ec4\u4ef6\u7684\u552f\u4e00\u6807\u8bc6\u7b26\u3002<\/td>\n<\/tr>\n<tr>\n<td><code>rendered<\/code><\/td>\n<td><code>true<\/code><\/td>\n<td><code>Boolean<\/code><\/td>\n<td>\u6307\u5b9a\u7ec4\u4ef6\u662f\u5426\u6e32\u67d3\u7684\u5e03\u5c14\u503c\uff0c\u8bbe\u7f6e\u4e3a <code>false<\/code> \u65f6\u7ec4\u4ef6\u5c06\u4e0d\u88ab\u6e32\u67d3\u3002<\/td>\n<\/tr>\n<tr>\n<td><code>binding<\/code><\/td>\n<td><code>null<\/code><\/td>\n<td><code>Object<\/code><\/td>\n<td>\u4e00\u4e2a EL \u8868\u8fbe\u5f0f\uff0c\u6620\u5c04\u5230\u540e\u53f0 Bean \u4e2d\u7684\u670d\u52a1\u5668\u7aef <code>UIComponent<\/code> \u5b9e\u4f8b\u3002<\/td>\n<\/tr>\n<tr>\n<td><code>value<\/code><\/td>\n<td><code>null<\/code><\/td>\n<td><code>Object<\/code><\/td>\n<td>\u4f5c\u4e3a\u540e\u53f0\u6a21\u578b\u7684 <code>TreeNode<\/code> \u5b9e\u4f8b\u3002<\/td>\n<\/tr>\n<tr>\n<td><code>var<\/code><\/td>\n<td><code>null<\/code><\/td>\n<td><code>String<\/code><\/td>\n<td>\u7528\u4e8e\u5f15\u7528\u6bcf\u4e2a\u6811\u8282\u70b9\u7684\u8bf7\u6c42\u4f5c\u7528\u57df\u53d8\u91cf\u7684\u540d\u79f0\u3002<\/td>\n<\/tr>\n<tr>\n<td><code>widgetVar<\/code><\/td>\n<td><code>null<\/code><\/td>\n<td><code>String<\/code><\/td>\n<td>\u5ba2\u6237\u7aef\u5c0f\u90e8\u4ef6\u7684\u540d\u79f0\u3002<\/td>\n<\/tr>\n<tr>\n<td><code>style<\/code><\/td>\n<td><code>null<\/code><\/td>\n<td><code>String<\/code><\/td>\n<td>\u5bb9\u5668\u5143\u7d20\u7684\u5185\u8054\u6837\u5f0f\u3002<\/td>\n<\/tr>\n<tr>\n<td><code>styleClass<\/code><\/td>\n<td><code>null<\/code><\/td>\n<td><code>String<\/code><\/td>\n<td>\u5bb9\u5668\u5143\u7d20\u7684\u6837\u5f0f\u7c7b\u3002<\/td>\n<\/tr>\n<tr>\n<td><code>selection<\/code><\/td>\n<td><code>null<\/code><\/td>\n<td><code>Object<\/code><\/td>\n<td>\u9009\u62e9\u5f15\u7528\u3002<\/td>\n<\/tr>\n<tr>\n<td><code>selectionMode<\/code><\/td>\n<td><code>null<\/code><\/td>\n<td><code>String<\/code><\/td>\n<td>\u9009\u62e9\u6a21\u5f0f\u7684\u7c7b\u578b\u3002<\/td>\n<\/tr>\n<tr>\n<td><code>scrollable<\/code><\/td>\n<td><code>false<\/code><\/td>\n<td><code>Boolean<\/code><\/td>\n<td>\u6570\u636e\u662f\u5426\u53ef\u6eda\u52a8\u3002<\/td>\n<\/tr>\n<tr>\n<td><code>scrollHeight<\/code><\/td>\n<td><code>null<\/code><\/td>\n<td><code>Integer<\/code><\/td>\n<td>\u53ef\u6eda\u52a8\u6570\u636e\u7684\u9ad8\u5ea6\u3002<\/td>\n<\/tr>\n<tr>\n<td><code>scrollWidth<\/code><\/td>\n<td><code>null<\/code><\/td>\n<td><code>Integer<\/code><\/td>\n<td>\u53ef\u6eda\u52a8\u6570\u636e\u7684\u5bbd\u5ea6\u3002<\/td>\n<\/tr>\n<tr>\n<td><code>tableStyle<\/code><\/td>\n<td><code>null<\/code><\/td>\n<td><code>String<\/code><\/td>\n<td>\u8868\u683c\u5143\u7d20\u7684\u5185\u8054\u6837\u5f0f\u3002<\/td>\n<\/tr>\n<tr>\n<td><code>tableStyleClass<\/code><\/td>\n<td><code>null<\/code><\/td>\n<td><code>String<\/code><\/td>\n<td>\u8868\u683c\u5143\u7d20\u7684\u6837\u5f0f\u7c7b\u3002<\/td>\n<\/tr>\n<tr>\n<td><code>emptyMessage<\/code><\/td>\n<td><code>No records found<\/code><\/td>\n<td><code>String<\/code><\/td>\n<td>\u6ca1\u6709\u6570\u636e\u663e\u793a\u65f6\u8981\u663e\u793a\u7684\u6587\u672c\u3002<\/td>\n<\/tr>\n<tr>\n<td><code>resizableColumns<\/code><\/td>\n<td><code>false<\/code><\/td>\n<td><code>Boolean<\/code><\/td>\n<td>\u5b9a\u4e49\u5217\u662f\u5426\u53ef\u4ee5\u8c03\u6574\u5927\u5c0f\u3002<\/td>\n<\/tr>\n<tr>\n<td><code>rowStyleClass<\/code><\/td>\n<td><code>null<\/code><\/td>\n<td><code>String<\/code><\/td>\n<td>\u6bcf\u884c\u7684\u6837\u5f0f\u7c7b\u3002<\/td>\n<\/tr>\n<tr>\n<td><code>liveResize<\/code><\/td>\n<td><code>false<\/code><\/td>\n<td><code>Boolean<\/code><\/td>\n<td>\u5728\u6b64\u6a21\u5f0f\u4e0b\uff0c\u5217\u4f1a\u5b9e\u65f6\u8c03\u6574\u5927\u5c0f\uff0c\u65e0\u9700\u4f7f\u7528\u8c03\u6574\u5927\u5c0f\u8f85\u52a9\u5de5\u5177\u3002<\/td>\n<\/tr>\n<tr>\n<td><code>required<\/code><\/td>\n<td><code>false<\/code><\/td>\n<td><code>Boolean<\/code><\/td>\n<td>\u9009\u62e9\u7684\u9a8c\u8bc1\u7ea6\u675f\u3002<\/td>\n<\/tr>\n<tr>\n<td><code>requiredMessage<\/code><\/td>\n<td><code>null<\/code><\/td>\n<td><code>String<\/code><\/td>\n<td>\u5fc5\u9009\u9009\u62e9\u9a8c\u8bc1\u7684\u6d88\u606f\u3002<\/td>\n<\/tr>\n<tr>\n<td><code>sortBy<\/code><\/td>\n<td><code>null<\/code><\/td>\n<td><code>ValueExpr<\/code><\/td>\n<td>\u9ed8\u8ba4\u6392\u5e8f\u7684\u8868\u8fbe\u5f0f\u3002<\/td>\n<\/tr>\n<tr>\n<td><code>sortOrder<\/code><\/td>\n<td><code>ascending<\/code><\/td>\n<td><code>String<\/code><\/td>\n<td>\u5b9a\u4e49\u9ed8\u8ba4\u6392\u5e8f\u987a\u5e8f\u3002<\/td>\n<\/tr>\n<tr>\n<td><code>sortFunction<\/code><\/td>\n<td><code>null<\/code><\/td>\n<td><code>MethodExpr<\/code><\/td>\n<td>\u7528\u4e8e\u9ed8\u8ba4\u6392\u5e8f\u7684\u81ea\u5b9a\u4e49\u53ef\u63d2\u62d4\u6392\u5e8f\u51fd\u6570\u3002<\/td>\n<\/tr>\n<tr>\n<td><code>nativeElements<\/code><\/td>\n<td><code>false<\/code><\/td>\n<td><code>Boolean<\/code><\/td>\n<td>\u5728\u539f\u751f\u6a21\u5f0f\u4e0b\uff0cTreeTable \u4f7f\u7528\u539f\u751f\u590d\u9009\u6846\u3002<\/td>\n<\/tr>\n<tr>\n<td><code>dataLocale<\/code><\/td>\n<td><code>null<\/code><\/td>\n<td><code>Object<\/code><\/td>\n<td>\u7528\u4e8e\u6392\u5e8f\u7b49\u529f\u80fd\u7684\u533a\u57df\u8bbe\u7f6e\uff0c\u9ed8\u8ba4\u4e3a\u89c6\u56fe\u533a\u57df\u8bbe\u7f6e\u3002<\/td>\n<\/tr>\n<tr>\n<td><code>caseSensitiveSort<\/code><\/td>\n<td><code>false<\/code><\/td>\n<td><code>Boolean<\/code><\/td>\n<td>\u6392\u5e8f\u662f\u5426\u533a\u5206\u5927\u5c0f\u5199\uff0c\u9ed8\u8ba4\u4e0d\u533a\u5206\u3002<\/td>\n<\/tr>\n<\/tbody>\n<\/table><\/div>\n<\/div>\n<h2>Primefaces TreeTable \u793a\u4f8b\u6559\u7a0b\uff1a\u6570\u636e\u7ed1\u5b9a\u4e0e\u9009\u62e9<\/h2>\n<p>\u672c\u6559\u7a0b\u662f\u300aPrimefaces \u6811(Tree)\u3001\u6811\u8282\u70b9(TreeNode)\u3001\u6811\u8868(TreeTable) \u793a\u4f8b\u6559\u7a0b\u300b\u7684\u7b2c11\u90e8\u5206\uff0c\u5c06\u6df1\u5165\u63a2\u8ba8\u5982\u4f55\u4f7f\u7528Primefaces TreeTable\u7ec4\u4ef6\u5c55\u793a\u6570\u636e\uff0c\u5e76\u4ecb\u7ecd\u5176\u9009\u62e9\u529f\u80fd\u3002<\/p>\n<p>\u4e0ePrimefaces Tree\u7ec4\u4ef6\u7c7b\u4f3c\uff0cTreeTable\u901a\u8fc7<code>TreeNode<\/code>\u5b9e\u4f8b\u8fdb\u884c\u6570\u636e\u586b\u5145\uff0c\u6bcf\u4e2a\u5b9e\u4f8b\u90fd\u4ee3\u8868\u4e00\u4e2a\u8282\u70b9\uff0c\u5e76\u4e0e\u6839\u8282\u70b9\u5173\u8054\u3002<code>TreeNode<\/code> API\u63d0\u4f9b\u4e86\u4e00\u79cd\u5206\u5c42\u7684\u6570\u636e\u7ed3\u6784\uff0c\u7528\u4e8e\u8868\u793a\u8981\u5728\u6811\u8868\u4e2d\u663e\u793a\u7684\u6570\u636e\u3002\u4ee5\u4e0b\u793a\u4f8b\u5c06\u5c55\u793a\u5982\u4f55\u4f7f\u7528TreeTable\u7ec4\u4ef6\u6765\u663e\u793a\u666e\u901a\u7684Java\u5bf9\u8c61\uff08POJO\uff09\u6587\u6863\u5b9e\u4f8b\u3002<\/p>\n<h3>index7.xhtml \u4ee3\u7801\u793a\u4f8b\uff1a<\/h3>\n<pre class=\"post-pre\"><code>&lt;html xmlns=\"https:\/\/www.w3.org\/1999\/xhtml\"\r\n\txmlns:ui=\"https:\/\/java.sun.com\/jsf\/facelets\"\r\n\txmlns:h=\"https:\/\/java.sun.com\/jsf\/html\"\r\n\txmlns:f=\"https:\/\/java.sun.com\/jsf\/core\"\r\n\txmlns:p=\"https:\/\/primefaces.org\/ui\"&gt;\r\n&lt;h:head&gt;\r\n\t&lt;script name=\"jquery\/jquery.js\" library=\"primefaces\"&gt;&lt;\/script&gt;\r\n&lt;\/h:head&gt;\r\n&lt;h:form&gt;\t\t\t\t\t\t\r\n\t&lt;p:treeTable value=\"#{treeTableManagedBean.root}\" var=\"node\"&gt;\r\n\t\t&lt;p:column&gt;\r\n\t\t\t&lt;f:facet name=\"header\"&gt;\r\n\t\t\t\t\u540d\u79f0\r\n\t\t\t&lt;\/f:facet&gt;\r\n\t\t\t&lt;h:outputText value=\"#{node.name}\"&gt;&lt;\/h:outputText&gt;\r\n\t\t&lt;\/p:column&gt;\r\n\t\t&lt;p:column&gt;\r\n\t\t\t&lt;f:facet name=\"header\"&gt;\r\n\t\t\t\t\u4f5c\u8005\r\n\t\t\t&lt;\/f:facet&gt;\r\n\t\t\t&lt;h:outputText value=\"#{node.author}\"&gt;&lt;\/h:outputText&gt;\r\n\t\t&lt;\/p:column&gt;\r\n\t\t&lt;p:column&gt;\r\n\t\t\t&lt;f:facet name=\"header\"&gt;\r\n\t\t\t\tID\r\n\t\t\t&lt;\/f:facet&gt;\r\n\t\t\t&lt;h:outputText value=\"#{node.id}\"&gt;&lt;\/h:outputText&gt;\r\n\t\t&lt;\/p:column&gt;\t\t\t\t\r\n\t&lt;\/p:treeTable&gt;\r\n&lt;\/h:form&gt;\r\n&lt;\/html&gt;\r\n<\/code><\/pre>\n<h3>Document.java \u4ee3\u7801\u793a\u4f8b\uff1a<\/h3>\n<pre class=\"post-pre\"><code>package com.Olivia.prime.faces.data;\r\n\r\npublic class Document {\r\n\tprivate String name;\r\n\tprivate String id;\r\n\tprivate String author;\r\n\t\r\n\tpublic Document(String name, String id,String author){\r\n\t\tthis.name = name;\r\n\t\tthis.id = id;\r\n\t\tthis.author = author;\r\n\t}\r\n\t\r\n\tpublic String getName() {\r\n\t\treturn name;\r\n\t}\r\n\tpublic void setName(String name) {\r\n\t\tthis.name = name;\r\n\t}\r\n\tpublic String getId() {\r\n\t\treturn id;\r\n\t}\r\n\tpublic void setId(String id) {\r\n\t\tthis.id = id;\r\n\t}\r\n\tpublic String getAuthor() {\r\n\t\treturn author;\r\n\t}\r\n\tpublic void setAuthor(String author) {\r\n\t\tthis.author = author;\r\n\t}\r\n}\r\n<\/code><\/pre>\n<h3>TreeTableManagedBean.java \u4ee3\u7801\u793a\u4f8b\uff1a<\/h3>\n<pre class=\"post-pre\"><code>package com.Olivia.prime.faces.beans;\r\n\r\nimport javax.faces.bean.ManagedBean;\r\nimport javax.faces.bean.SessionScoped;\r\n\r\nimport org.primefaces.model.DefaultTreeNode;\r\nimport org.primefaces.model.TreeNode;\r\n\r\nimport com.Olivia.prime.faces.data.Document;\r\n\r\n@ManagedBean\r\n@SessionScoped\r\npublic class TreeTableManagedBean {\r\n\t\r\n\tprivate TreeNode root = new DefaultTreeNode(\"\u6839\u8282\u70b9\", null);\r\n\r\n\tpublic TreeTableManagedBean(){\r\n\t\t\/\/ \u586b\u5145\u6587\u6863\u5b9e\u4f8b\r\n\t\tDocument doc01 = new Document(\"Primefaces \u6559\u7a0b\",\"1\",\"Primefaces \u516c\u53f8\");\r\n\t\t\r\n\t\tDocument doc02 = new Document(\"Hibernate \u6559\u7a0b\",\"2\",\"JournalDev\");\r\n\t\t\r\n\t\t\/\/ \u521b\u5efa\u6587\u6863 TreeNode\r\n\t\tTreeNode documents = new DefaultTreeNode(new Document(\"\u6587\u6863\",\"0\",\"\u6587\u6863\"), this.root);\r\n\t\t\/\/ \u521b\u5efa\u5177\u4f53\u6587\u6863 TreeNode\r\n\t\tTreeNode document01 = new DefaultTreeNode(doc01, documents);\r\n\t\tTreeNode document02 = new DefaultTreeNode(doc02, documents);\r\n\t}\r\n\t\r\n\tpublic TreeNode getRoot() {\r\n\t\treturn root;\r\n\t}\r\n\r\n\tpublic void setRoot(TreeNode root) {\r\n\t\tthis.root = root;\r\n\t}\r\n}\r\n<\/code><\/pre>\n<h2>Primefaces TreeTable &#8211; \u9009\u62e9\u529f\u80fd<\/h2>\n<p>\u4e0e\u6811\u7ec4\u4ef6\u7c7b\u4f3c\uff0c\u8282\u70b9\u9009\u62e9\u662fPrimeFaces\u5185\u7f6e\u7684\u529f\u80fd\uff0c\u60a8\u53ef\u4ee5\u901a\u8fc7\u5b83\u6765\u786e\u5b9a\u9009\u62e9\u7684\u7c7b\u578b\u3002\u53ef\u9009\u503c\u5305\u62ec\uff1a<code>Single<\/code>\uff08\u5355\u9009\uff09\u3001<code>Multiple<\/code>\uff08\u591a\u9009\uff09\u548c<code>Checkbox<\/code>\uff08\u590d\u9009\u6846\uff09\u3002\u5355\u9009\u6a21\u5f0f\u4e0b\uff0c\u9009\u5b9a\u7684\u8282\u70b9\u5c06\u7ed1\u5b9a\u5230\u4e00\u4e2a<code>TreeNode<\/code>\u5b9e\u4f8b\uff1b\u800c\u591a\u9009\u548c\u590d\u9009\u6846\u6a21\u5f0f\u4e0b\uff0c\u5219\u4f1a\u4f7f\u7528<code>TreeNode<\/code>\u6570\u7ec4\u6765\u5b58\u50a8\u9009\u5b9a\u7684\u8282\u70b9\u3002\u4ee5\u4e0b\u793a\u4f8b\u5c55\u793a\u4e86\u5982\u4f55\u901a\u8fc7\u663e\u793aGrowl\u6d88\u606f\u6765\u5c01\u88c5\u7528\u6237\u9009\u62e9\u3002\u6b64\u793a\u4f8b\u4f7f\u7528\u4e86PrimeFaces\u63d0\u4f9b\u7684<code>p:commandButton<\/code>\u7ec4\u4ef6\uff0c\u5176\u5177\u4f53\u7528\u6cd5\u5c06\u5728\u540e\u7eed\u8ba8\u8bba\u3002<code>index8.xhtml<\/code>\u4ee3\u7801\u5982\u4e0b\uff1a<\/p>\n<pre class=\"post-pre\"><code>&lt;html xmlns=\"https:\/\/www.w3.org\/1999\/xhtml\"\r\n\txmlns:ui=\"https:\/\/java.sun.com\/jsf\/facelets\"\r\n\txmlns:h=\"https:\/\/java.sun.com\/jsf\/html\"\r\n\txmlns:f=\"https:\/\/java.sun.com\/jsf\/core\"\r\n\txmlns:p=\"https:\/\/primefaces.org\/ui\"&gt;\r\n&lt;h:head&gt;\r\n\t&lt;script name=\"jquery\/jquery.js\" library=\"primefaces\"&gt;&lt;\/script&gt;\r\n&lt;\/h:head&gt;\r\n&lt;h:form&gt;\t\t\t\r\n\t&lt;p:growl id=\"message\" \/&gt;\t\t\t\t\r\n\t&lt;p:treeTable value=\"#{treeTableManagedBean.root}\" var=\"node\" selectionMode=\"single\"\r\n\t\tselection=\"#{treeTableManagedBean.singleSelectedNode}\"&gt;\r\n\t\t&lt;p:column&gt;\r\n\t\t\t&lt;f:facet name=\"header\"&gt;\r\n\t\t\t\t\u540d\u79f0\r\n\t\t\t&lt;\/f:facet&gt;\r\n\t\t\t&lt;h:outputText value=\"#{node.name}\" \/&gt;\r\n\t\t&lt;\/p:column&gt;\r\n\t\t&lt;p:column&gt;\r\n\t\t\t&lt;f:facet name=\"header\"&gt;\r\n\t\t\t\t\u4f5c\u8005\r\n\t\t\t&lt;\/f:facet&gt;\r\n\t\t\t&lt;h:outputText value=\"#{node.author}\" \/&gt;\r\n\t\t&lt;\/p:column&gt;\r\n\t\t&lt;p:column&gt;\r\n\t\t\t&lt;f:facet name=\"header\"&gt;\r\n\t\t\t\tID\r\n\t\t\t&lt;\/f:facet&gt;\r\n\t\t\t&lt;h:outputText value=\"#{node.id}\" \/&gt;\r\n\t\t&lt;\/p:column&gt;\t\t\t\t\r\n\t&lt;\/p:treeTable&gt;\r\n\t&lt;p:treeTable value=\"#{treeTableManagedBean.root}\" var=\"node\" selectionMode=\"multiple\"\r\n\t\tselection=\"#{treeTableManagedBean.multipleSelectedNodes}\"&gt;\r\n\t\t&lt;p:column&gt;\r\n\t\t\t&lt;f:facet name=\"header\"&gt;\r\n\t\t\t\t\u540d\u79f0\r\n\t\t\t&lt;\/f:facet&gt;\r\n\t\t\t&lt;h:outputText value=\"#{node.name}\" \/&gt;\r\n\t\t&lt;\/p:column&gt;\r\n\t\t&lt;p:column&gt;\r\n\t\t\t&lt;f:facet name=\"header\"&gt;\r\n\t\t\t\t\u4f5c\u8005\r\n\t\t\t&lt;\/f:facet&gt;\r\n\t\t\t&lt;h:outputText value=\"#{node.author}\" \/&gt;\r\n\t\t&lt;\/p:column&gt;\r\n\t\t&lt;p:column&gt;\r\n\t\t\t&lt;f:facet name=\"header\"&gt;\r\n\t\t\t\tID\r\n\t\t\t&lt;\/f:facet&gt;\r\n\t\t\t&lt;h:outputText value=\"#{node.id}\" \/&gt;\r\n\t\t&lt;\/p:column&gt;\t\t\t\t\r\n\t&lt;\/p:treeTable&gt;\r\n\t&lt;p:treeTable value=\"#{treeTableManagedBean.root}\" var=\"node\" selectionMode=\"checkbox\"\r\n\t\tselection=\"#{treeTableManagedBean.checkboxSelectedNodes}\"&gt;\r\n\t\t&lt;p:column&gt;\r\n\t\t\t&lt;f:facet name=\"header\"&gt;\r\n\t\t\t\t\u540d\u79f0\r\n\t\t\t&lt;\/f:facet&gt;\r\n\t\t\t&lt;h:outputText value=\"#{node.name}\" \/&gt;\r\n\t\t&lt;\/p:column&gt;\r\n\t\t&lt;p:column&gt;\r\n\t\t\t&lt;f:facet name=\"header\"&gt;\r\n\t\t\t\t\u4f5c\u8005\r\n\t\t\t&lt;\/f:facet&gt;\r\n\t\t\t&lt;h:outputText value=\"#{node.author}\" \/&gt;\r\n\t\t&lt;\/p:column&gt;\r\n\t\t&lt;p:column&gt;\r\n\t\t\t&lt;f:facet name=\"header\"&gt;\r\n\t\t\t\tID\r\n\t\t\t&lt;\/f:facet&gt;\r\n\t\t\t&lt;h:outputText value=\"#{node.id}\" \/&gt;\r\n\t\t&lt;\/p:column&gt;\t\t\t\t\r\n\t&lt;\/p:treeTable&gt;\t\r\n\t&lt;p:commandButton value=\"\u663e\u793a\u9009\u5b9a\u6587\u6863\" action=\"#{treeTableManagedBean.viewSelectedNodes}\" process=\"@form\" update=\"message\" \/&gt;\t\r\n&lt;\/h:form&gt;\r\n&lt;\/html&gt;<\/code><\/pre>\n<pre class=\"post-pre\"><code>package com.Olivia.prime.faces.beans;\r\n\r\nimport javax.faces.application.FacesMessage;\r\nimport javax.faces.bean.ManagedBean;\r\nimport javax.faces.bean.SessionScoped;\r\nimport javax.faces.context.FacesContext;\r\n\r\nimport org.primefaces.model.DefaultTreeNode;\r\nimport org.primefaces.model.TreeNode;\r\n\r\nimport com.Olivia.prime.faces.data.Document;\r\n\r\n@ManagedBean\r\n@SessionScoped\r\npublic class TreeTableManagedBean {\r\n\t\r\n\tprivate TreeNode root = new DefaultTreeNode(\"\u6839\u8282\u70b9\", null);\r\n\tprivate TreeNode singleSelectedNode;\r\n\tprivate TreeNode [] multipleSelectedNodes;\r\n\tprivate TreeNode [] checkboxSelectedNodes;\r\n\r\n\tpublic TreeTableManagedBean(){\r\n\t\t\/\/ \u586b\u5145\u6587\u6863\u5b9e\u4f8b\r\n\t\tDocument doc01 = new Document(\"Primefaces \u6559\u7a0b\",\"1\",\"Primefaces \u516c\u53f8\");\t\r\n\t\tDocument doc02 = new Document(\"Hibernate \u6559\u7a0b\",\"2\",\"JournalDev\");\r\n\t\t\/\/ \u521b\u5efa\u6587\u6863\u6811\u8282\u70b9\r\n\t\tTreeNode documents = new DefaultTreeNode(new Document(\"\u6587\u6863\",\"0\",\"\u6587\u6863\"), this.root);\r\n\t\t\/\/ \u521b\u5efa\u6587\u6863\u6811\u8282\u70b9\r\n\t\tTreeNode document01 = new DefaultTreeNode(doc01, documents);\r\n\t\tTreeNode document02 = new DefaultTreeNode(doc02, documents);\r\n\t}\r\n\t\r\n\tpublic TreeNode getRoot() {\r\n\t\treturn root;\r\n\t}\r\n\r\n\tpublic void setRoot(TreeNode root) {\r\n\t\tthis.root = root;\r\n\t}\r\n\r\n\tpublic TreeNode getSingleSelectedNode() {\r\n\t\treturn singleSelectedNode;\r\n\t}\r\n\r\n\tpublic void setSingleSelectedNode(TreeNode singleSelectedNode) {\r\n\t\tthis.singleSelectedNode = singleSelectedNode;\r\n\t}\r\n\r\n\tpublic TreeNode[] getMultipleSelectedNodes() {\r\n\t\treturn multipleSelectedNodes;\r\n\t}\r\n\r\n\tpublic void setMultipleSelectedNodes(TreeNode[] multipleSelectedNodes) {\r\n\t\tthis.multipleSelectedNodes = multipleSelectedNodes;\r\n\t}\r\n\r\n\tpublic TreeNode[] getCheckboxSelectedNodes() {\r\n\t\treturn checkboxSelectedNodes;\r\n\t}\r\n\r\n\tpublic void setCheckboxSelectedNodes(TreeNode[] checkboxSelectedNodes) {\r\n\t\tthis.checkboxSelectedNodes = checkboxSelectedNodes;\r\n\t}\r\n\t\r\n\tpublic String viewSelectedNodes(){\r\n\t\tString message = \"\u60a8\u5df2\u9009\u62e9\u7684\u6587\u6863\uff1a\";\r\n\t\tif (this.singleSelectedNode != null) {\r\n\t\t    message += \"- \" + ((Document)this.singleSelectedNode.getData()).getName() + \"\\n\";\r\n\t\t}\r\n\t\tif (this.multipleSelectedNodes != null) {\r\n\t\t    for(TreeNode node : this.multipleSelectedNodes){\r\n\t\t\t    message += \"- \" + ((Document)node.getData()).getName() + \"\\n\";\t\r\n\t\t    }\r\n\t\t}\r\n\t\tif (this.checkboxSelectedNodes != null) {\r\n\t\t    for(TreeNode node : this.checkboxSelectedNodes){\r\n\t\t\t    message += \"- \" + ((Document)node.getData()).getName() + \"\\n\";\t\r\n\t\t    }\r\n\t\t}\r\n\t\tFacesContext.getCurrentInstance().addMessage(null, new FacesMessage(message));\r\n\t\treturn \"\";\r\n\t}\r\n}\r\n<\/code><\/pre>\n<h2>PrimeFaces TreeTable &#8211; Ajax\u884c\u4e3a\u4e8b\u4ef6\u548c\u4e0a\u4e0b\u6587\u83dc\u5355<\/h2>\n<p>\u8fd9\u662f\u6587\u7ae0\u300aPrimefaces \u6811(Tree)\u3001\u6811\u8282\u70b9(TreeNode)\u3001\u6811\u8868(TreeTable) \u793a\u4f8b\u6559\u7a0b\u300b\u7684\u7b2c13\u90e8\u5206\uff08\u517113\u90e8\u5206\uff09\u3002<\/p>\n<h3>TreeTable Ajax\u4e8b\u4ef6\u4e0e\u5217\u5bbd\u8c03\u6574<\/h3>\n<p>TreeTable \u7ec4\u4ef6\u5df2\u652f\u6301\u4e0e Tree \u7ec4\u4ef6\u76f8\u540c\u7684 Ajax \u884c\u4e3a\u4e8b\u4ef6\u3002\u552f\u4e00\u7684\u4f8b\u5916\u662f <code>colResize<\/code> \u4e8b\u4ef6\uff0c\u8be5\u4e8b\u4ef6\u5728\u8c03\u6574\u5217\u5bbd\u65f6\u89e6\u53d1\u3002<code>ContextMenu<\/code> \u7684\u4f7f\u7528\u65b9\u5f0f\u4e0e Tree \u7ec4\u4ef6\u4e2d\u6ca1\u6709\u533a\u522b\u3002\u4e0d\u5e78\u7684\u662f\uff0c\u6211\u4eec\u76ee\u524d\u4f7f\u7528\u7684 PrimeFaces 5.0 \u514d\u8d39\u7248\u672c\u5b58\u5728\u4e00\u4e2a\u4e25\u91cd\u95ee\u9898\uff0c\u65e0\u6cd5\u786e\u5b9a\u662f\u5426\u652f\u6301\u5217\u5bbd\u8c03\u6574\u4e8b\u4ef6\u7684\u76d1\u542c\u3002\u4f46\u662f\uff0c\u4e3a\u4e86\u4e86\u89e3\u5982\u4f55\u76d1\u542c\u6b64\u7c7b\u4e8b\u4ef6\uff0c\u4e0b\u9762\u63d0\u4f9b\u4e86\u4e00\u4e2a\u7b80\u5355\u7684\u793a\u4f8b\uff1a<\/p>\n<h4>index9.xhtml \u4ee3\u7801\uff1a<\/h4>\n<pre class=\"post-pre\"><code>&lt;html xmlns=\"https:\/\/www.w3.org\/1999\/xhtml\"\r\n\txmlns:ui=\"https:\/\/java.sun.com\/jsf\/facelets\"\r\n\txmlns:h=\"https:\/\/java.sun.com\/jsf\/html\"\r\n\txmlns:f=\"https:\/\/java.sun.com\/jsf\/core\"\r\n\txmlns:p=\"https:\/\/primefaces.org\/ui\"&gt;\r\n&lt;h:head&gt;\r\n\t&lt;script name=\"jquery\/jquery.js\" library=\"primefaces\"&gt;&lt;\/script&gt;\r\n&lt;\/h:head&gt;\r\n&lt;h:form&gt;\t\t\t\t\t\t\r\n\t&lt;p:treeTable value=\"#{treeTableManagedBean.root}\" var=\"node\" resizableColumns=\"true\"&gt;\r\n\t\t&lt;p:column&gt;\r\n\t\t\t&lt;f:facet name=\"header\"&gt;\r\n\t\t\t\t\u540d\u79f0\r\n\t\t\t&lt;\/f:facet&gt;\r\n\t\t\t&lt;h:outputText value=\"#{node.name}\"&gt;&lt;\/h:outputText&gt;\r\n\t\t&lt;\/p:column&gt;\r\n\t\t&lt;p:column&gt;\r\n\t\t\t&lt;f:facet name=\"header\"&gt;\r\n\t\t\t\t\u4f5c\u8005\r\n\t\t\t&lt;\/f:facet&gt;\r\n\t\t\t&lt;h:outputText value=\"#{node.author}\"&gt;&lt;\/h:outputText&gt;\r\n\t\t&lt;\/p:column&gt;\r\n\t\t&lt;p:column&gt;\r\n\t\t\t&lt;f:facet name=\"header\"&gt;\r\n\t\t\t\tID\r\n\t\t\t&lt;\/f:facet&gt;\r\n\t\t\t&lt;h:outputText value=\"#{node.id}\"&gt;&lt;\/h:outputText&gt;\r\n\t\t&lt;\/p:column&gt;\t\t\t\t\r\n\t\t&lt;p:ajax event=\"colResize\" listener=\"#{treeTableManagedBean.colResizeListener}\"&gt;&lt;\/p:ajax&gt;\r\n\t&lt;\/p:treeTable&gt;\r\n&lt;\/h:form&gt;\r\n&lt;\/html&gt;\r\n<\/code><\/pre>\n<pre class=\"post-pre\"><code>\/\/ .. \u90e8\u5206\u6240\u9700\u4ee3\u7801\r\n\tpublic void colResizeListener(ColumnResizeEvent e){\r\n\t\tString message =\"\u5217\u5bbd\u8c03\u6574\u4e8b\u4ef6\u5df2\u89e6\u53d1\";\r\n\t\tFacesContext.getCurrentInstance().addMessage(null, new FacesMessage(message));\r\n\t}\r\n<\/code><\/pre>\n<h2>Primefaces TreeTable &#8211; \u6392\u5e8f<\/h2>\n<p>\u901a\u8fc7\u5728\u5217\u7ea7\u522b\u8bbe\u7f6e <code>sortBy<\/code> \u8868\u8fbe\u5f0f\u53ef\u4ee5\u542f\u7528\u6392\u5e8f\u3002<\/p>\n<h4>index10.xhtml \u4ee3\u7801\uff1a<\/h4>\n<pre class=\"post-pre\"><code>&lt;html xmlns=\"https:\/\/www.w3.org\/1999\/xhtml\"\r\n\txmlns:ui=\"https:\/\/java.sun.com\/jsf\/facelets\"\r\n\txmlns:h=\"https:\/\/java.sun.com\/jsf\/html\"\r\n\txmlns:f=\"https:\/\/java.sun.com\/jsf\/core\"\r\n\txmlns:p=\"https:\/\/primefaces.org\/ui\"&gt;\r\n&lt;h:head&gt;\r\n\t&lt;script name=\"jquery\/jquery.js\" library=\"primefaces\"&gt;&lt;\/script&gt;\r\n&lt;\/h:head&gt;\r\n&lt;h:form&gt;\t\t\t\t\t\t\r\n\t&lt;p:treeTable value=\"#{treeTableManagedBean.root}\" var=\"node\"&gt;\r\n\t\t&lt;p:column sortBy=\"#{node.name}\"&gt;\r\n\t\t\t&lt;f:facet name=\"header\"&gt;\r\n\t\t\t\t\u540d\u79f0\r\n\t\t\t&lt;\/f:facet&gt;\r\n\t\t\t&lt;h:outputText value=\"#{node.name}\"&gt;&lt;\/h:outputText&gt;\r\n\t\t&lt;\/p:column&gt;\r\n\t\t&lt;p:column sortBy=\"#{node.author}\"&gt;\r\n\t\t\t&lt;f:facet name=\"header\"&gt;\r\n\t\t\t\t\u4f5c\u8005\r\n\t\t\t&lt;\/f:facet&gt;\r\n\t\t\t&lt;h:outputText value=\"#{node.author}\"&gt;&lt;\/h:outputText&gt;\r\n\t\t&lt;\/p:column&gt;\r\n\t\t&lt;p:column sortBy=\"#{node.id}\"&gt;\r\n\t\t\t&lt;f:facet name=\"header\"&gt;\r\n\t\t\t\tID\r\n\t\t\t&lt;\/f:facet&gt;\r\n\t\t\t&lt;h:outputText value=\"#{node.id}\"&gt;&lt;\/h:outputText&gt;\r\n\t\t&lt;\/p:column&gt;\t\t\t\t\r\n\t&lt;\/p:treeTable&gt;\r\n&lt;\/h:form&gt;\r\n&lt;\/html&gt;\r\n<\/code><\/pre>\n<p>\u5982\u679c\u4f60\u5e0c\u671b\u9875\u9762\u52a0\u8f7d\u65f6\u4ee5\u6392\u5e8f\u65b9\u5f0f\u663e\u793a TreeTable\uff0c\u8bf7\u4f7f\u7528 TreeTable \u7684 <code>sortBy<\/code> \u5c5e\u6027\uff0c\u53ef\u9009\u7684 <code>sortOrder<\/code> \u548c <code>sortFunction<\/code> \u5c5e\u6027\u7528\u4e8e\u5b9a\u4e49\u9ed8\u8ba4\u6392\u5e8f\u987a\u5e8f\uff08\u5347\u5e8f\u6216\u964d\u5e8f\uff09\u548c\u5b9e\u9645\u6392\u5e8f\u7684 Java \u65b9\u6cd5\u3002<\/p>\n<h2>Primefaces \u6811\u7ec4\u4ef6\u3001TreeNode \u548c TreeTable \u603b\u7ed3<\/h2>\n<p>\u6811\u72b6\u548c\u6811\u8868\u683c\u7ec4\u4ef6\u88ab\u5e7f\u6cdb\u7528\u4e8e\u5c55\u793a\u7ed3\u6784\u5316\u7684\u5c42\u7ea7\u6570\u636e\u3002\u6211\u4eec\u5b66\u4e60\u4e86\u5982\u4f55\u6b63\u786e\u4f7f\u7528\u8fd9\u4e9b\u7ec4\u4ef6\u4ee5\u53ca\u6240\u9700\u7684\u4e3b\u8981\u5c5e\u6027\u3002\u8bf7\u5728\u4e0b\u65b9\u8bc4\u8bba\u4e2d\u5411\u6211\u4eec\u63d0\u4f9b\u8d21\u732e\uff0c\u5e76\u53ef\u4e0b\u8f7d\u4e0b\u65b9\u7684\u6e90\u4ee3\u7801\u4ee5\u4f9b\u4f7f\u7528\u3002<\/p>\n<h3>\u4e0b\u8f7d PrimeFaces Tree \u9879\u76ee<\/h3>\n<p><strong>\u8981\u6c42\uff1a<\/strong><\/p>\n<ul>\n<li>Java Development Kit (JDK) 8 \u6216\u66f4\u9ad8\u7248\u672c<\/li>\n<li>Apache Maven 3.x<\/li>\n<li>\u96c6\u6210\u5f00\u53d1\u73af\u5883 (IDE)\uff0c\u5982 Eclipse \u6216 IntelliJ IDEA<\/li>\n<\/ul>\n","protected":false},"excerpt":{"rendered":"<p>\u8fd9\u662f\u6587\u7ae0\u300aPrimeFaces \u6811(Tree)\u3001\u6811\u8282\u70b9(TreeNode)\u3001\u6811\u8868(TreeTable) \u793a\u4f8b\u6559 [&hellip;]<\/p>\n","protected":false},"author":6,"featured_media":0,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[1],"tags":[870,866,867,868,869],"class_list":["post-227","post","type-post","status-publish","format-standard","hentry","category-uncategorized","tag-jsf","tag-primefaces","tag-tree","tag-treenode","tag-treetable"],"yoast_head":"<!-- This site is optimized with the Yoast SEO Premium plugin v21.5 (Yoast SEO v21.5) - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>PrimeFaces\u6811\u5f62\u7ec4\u4ef6\u6df1\u5ea6\u6559\u7a0b\uff1aTree\u3001TreeNode\u4e0eTreeTable\u5b9e\u6218\u6307\u5357 - Blog - Silicon Cloud<\/title>\n<meta name=\"description\" content=\"\u672c\u6559\u7a0b\u8be6\u7ec6\u8bb2\u89e3PrimeFaces\u6846\u67b6\u4e2d\u5f3a\u5927\u7684\u6811\u5f62\u7ec4\u4ef6\uff0c\u5305\u62ecTree\uff08\u6811\uff09\u3001TreeNode\uff08\u6811\u8282\u70b9\uff09\u548cTreeTable\uff08\u6811\u8868\uff09\u7684\u7528\u6cd5\u3002\u901a\u8fc7\u4e30\u5bcc\u7684\u793a\u4f8b\u4ee3\u7801\uff0c\u52a9\u60a8\u8f7b\u677e\u638c\u63e1PrimeFaces\u6811\u5f62\u7ed3\u6784\u7684\u521b\u5efa\u3001\u6570\u636e\u7ed1\u5b9a\u3001\u4e8b\u4ef6\u5904\u7406\u53ca\u9ad8\u7ea7\u5b9a\u5236\uff0c\u63d0\u5347Web\u5e94\u7528\u7684\u7528\u6237\u4f53\u9a8c\u548c\u6570\u636e\u53ef\u89c6\u5316\u80fd\u529b\u3002\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.silicloud.com\/zh\/blog\/primefaces-\u6811tree\u3001\u6811\u8282\u70b9treenode\u3001\u6811\u8868treetable-\u793a\u4f8b\u6559\u7a0b\/\" \/>\n<meta property=\"og:locale\" content=\"zh_CN\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"PrimeFaces\u6811\u5f62\u7ec4\u4ef6\u6df1\u5ea6\u6559\u7a0b\uff1aTree\u3001TreeNode\u4e0eTreeTable\u5b9e\u6218\u6307\u5357\" \/>\n<meta property=\"og:description\" content=\"\u672c\u6559\u7a0b\u8be6\u7ec6\u8bb2\u89e3PrimeFaces\u6846\u67b6\u4e2d\u5f3a\u5927\u7684\u6811\u5f62\u7ec4\u4ef6\uff0c\u5305\u62ecTree\uff08\u6811\uff09\u3001TreeNode\uff08\u6811\u8282\u70b9\uff09\u548cTreeTable\uff08\u6811\u8868\uff09\u7684\u7528\u6cd5\u3002\u901a\u8fc7\u4e30\u5bcc\u7684\u793a\u4f8b\u4ee3\u7801\uff0c\u52a9\u60a8\u8f7b\u677e\u638c\u63e1PrimeFaces\u6811\u5f62\u7ed3\u6784\u7684\u521b\u5efa\u3001\u6570\u636e\u7ed1\u5b9a\u3001\u4e8b\u4ef6\u5904\u7406\u53ca\u9ad8\u7ea7\u5b9a\u5236\uff0c\u63d0\u5347Web\u5e94\u7528\u7684\u7528\u6237\u4f53\u9a8c\u548c\u6570\u636e\u53ef\u89c6\u5316\u80fd\u529b\u3002\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.silicloud.com\/zh\/blog\/primefaces-\u6811tree\u3001\u6811\u8282\u70b9treenode\u3001\u6811\u8868treetable-\u793a\u4f8b\u6559\u7a0b\/\" \/>\n<meta property=\"og:site_name\" content=\"Blog - Silicon Cloud\" \/>\n<meta property=\"article:published_time\" content=\"2022-11-07T14:02:14+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2025-07-31T18:40:16+00:00\" \/>\n<meta name=\"author\" content=\"\u6587, \u7fd4\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"\u4f5c\u8005\" \/>\n\t<meta name=\"twitter:data1\" content=\"\u6587, \u7fd4\" \/>\n\t<meta name=\"twitter:label2\" content=\"\u9884\u8ba1\u9605\u8bfb\u65f6\u95f4\" \/>\n\t<meta name=\"twitter:data2\" content=\"6 \u5206\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\/\/www.silicloud.com\/zh\/blog\/primefaces-%e6%a0%91tree%e3%80%81%e6%a0%91%e8%8a%82%e7%82%b9treenode%e3%80%81%e6%a0%91%e8%a1%a8treetable-%e7%a4%ba%e4%be%8b%e6%95%99%e7%a8%8b\/\",\"url\":\"https:\/\/www.silicloud.com\/zh\/blog\/primefaces-%e6%a0%91tree%e3%80%81%e6%a0%91%e8%8a%82%e7%82%b9treenode%e3%80%81%e6%a0%91%e8%a1%a8treetable-%e7%a4%ba%e4%be%8b%e6%95%99%e7%a8%8b\/\",\"name\":\"PrimeFaces\u6811\u5f62\u7ec4\u4ef6\u6df1\u5ea6\u6559\u7a0b\uff1aTree\u3001TreeNode\u4e0eTreeTable\u5b9e\u6218\u6307\u5357 - Blog - Silicon Cloud\",\"isPartOf\":{\"@id\":\"https:\/\/www.silicloud.com\/zh\/blog\/#website\"},\"datePublished\":\"2022-11-07T14:02:14+00:00\",\"dateModified\":\"2025-07-31T18:40:16+00:00\",\"author\":{\"@id\":\"https:\/\/www.silicloud.com\/zh\/blog\/#\/schema\/person\/64d5cc7727fffbff2f9a2a8da1de3e5c\"},\"description\":\"\u672c\u6559\u7a0b\u8be6\u7ec6\u8bb2\u89e3PrimeFaces\u6846\u67b6\u4e2d\u5f3a\u5927\u7684\u6811\u5f62\u7ec4\u4ef6\uff0c\u5305\u62ecTree\uff08\u6811\uff09\u3001TreeNode\uff08\u6811\u8282\u70b9\uff09\u548cTreeTable\uff08\u6811\u8868\uff09\u7684\u7528\u6cd5\u3002\u901a\u8fc7\u4e30\u5bcc\u7684\u793a\u4f8b\u4ee3\u7801\uff0c\u52a9\u60a8\u8f7b\u677e\u638c\u63e1PrimeFaces\u6811\u5f62\u7ed3\u6784\u7684\u521b\u5efa\u3001\u6570\u636e\u7ed1\u5b9a\u3001\u4e8b\u4ef6\u5904\u7406\u53ca\u9ad8\u7ea7\u5b9a\u5236\uff0c\u63d0\u5347Web\u5e94\u7528\u7684\u7528\u6237\u4f53\u9a8c\u548c\u6570\u636e\u53ef\u89c6\u5316\u80fd\u529b\u3002\",\"breadcrumb\":{\"@id\":\"https:\/\/www.silicloud.com\/zh\/blog\/primefaces-%e6%a0%91tree%e3%80%81%e6%a0%91%e8%8a%82%e7%82%b9treenode%e3%80%81%e6%a0%91%e8%a1%a8treetable-%e7%a4%ba%e4%be%8b%e6%95%99%e7%a8%8b\/#breadcrumb\"},\"inLanguage\":\"zh-Hans\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/www.silicloud.com\/zh\/blog\/primefaces-%e6%a0%91tree%e3%80%81%e6%a0%91%e8%8a%82%e7%82%b9treenode%e3%80%81%e6%a0%91%e8%a1%a8treetable-%e7%a4%ba%e4%be%8b%e6%95%99%e7%a8%8b\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/www.silicloud.com\/zh\/blog\/primefaces-%e6%a0%91tree%e3%80%81%e6%a0%91%e8%8a%82%e7%82%b9treenode%e3%80%81%e6%a0%91%e8%a1%a8treetable-%e7%a4%ba%e4%be%8b%e6%95%99%e7%a8%8b\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"\u9996\u9875\",\"item\":\"https:\/\/www.silicloud.com\/zh\/blog\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"PrimeFaces\u6811\u5f62\u7ec4\u4ef6\u6df1\u5ea6\u6559\u7a0b\uff1aTree\u3001TreeNode\u4e0eTreeTable\u5b9e\u6218\u6307\u5357\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/www.silicloud.com\/zh\/blog\/#website\",\"url\":\"https:\/\/www.silicloud.com\/zh\/blog\/\",\"name\":\"Blog - Silicon Cloud\",\"description\":\"\",\"inLanguage\":\"zh-Hans\"},{\"@type\":\"Person\",\"@id\":\"https:\/\/www.silicloud.com\/zh\/blog\/#\/schema\/person\/64d5cc7727fffbff2f9a2a8da1de3e5c\",\"name\":\"\u6587, \u7fd4\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"zh-Hans\",\"@id\":\"https:\/\/www.silicloud.com\/zh\/blog\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/920c3d673e0bccacc98e5e6b7149bb3c22edd8d39cb753e5d7d7e471498118a1?s=96&d=mm&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/920c3d673e0bccacc98e5e6b7149bb3c22edd8d39cb753e5d7d7e471498118a1?s=96&d=mm&r=g\",\"caption\":\"\u6587, \u7fd4\"},\"url\":\"https:\/\/www.silicloud.com\/zh\/blog\/author\/wenxiang\/\"},{\"@type\":\"ImageObject\",\"inLanguage\":\"zh-Hans\",\"@id\":\"https:\/\/www.silicloud.com\/zh\/blog\/primefaces-%e6%a0%91tree%e3%80%81%e6%a0%91%e8%8a%82%e7%82%b9treenode%e3%80%81%e6%a0%91%e8%a1%a8treetable-%e7%a4%ba%e4%be%8b%e6%95%99%e7%a8%8b\/#local-main-organization-logo\",\"url\":\"\",\"contentUrl\":\"\",\"caption\":\"Blog - Silicon Cloud\"}]}<\/script>\n<!-- \/ Yoast SEO Premium plugin. -->","yoast_head_json":{"title":"PrimeFaces\u6811\u5f62\u7ec4\u4ef6\u6df1\u5ea6\u6559\u7a0b\uff1aTree\u3001TreeNode\u4e0eTreeTable\u5b9e\u6218\u6307\u5357 - Blog - Silicon Cloud","description":"\u672c\u6559\u7a0b\u8be6\u7ec6\u8bb2\u89e3PrimeFaces\u6846\u67b6\u4e2d\u5f3a\u5927\u7684\u6811\u5f62\u7ec4\u4ef6\uff0c\u5305\u62ecTree\uff08\u6811\uff09\u3001TreeNode\uff08\u6811\u8282\u70b9\uff09\u548cTreeTable\uff08\u6811\u8868\uff09\u7684\u7528\u6cd5\u3002\u901a\u8fc7\u4e30\u5bcc\u7684\u793a\u4f8b\u4ee3\u7801\uff0c\u52a9\u60a8\u8f7b\u677e\u638c\u63e1PrimeFaces\u6811\u5f62\u7ed3\u6784\u7684\u521b\u5efa\u3001\u6570\u636e\u7ed1\u5b9a\u3001\u4e8b\u4ef6\u5904\u7406\u53ca\u9ad8\u7ea7\u5b9a\u5236\uff0c\u63d0\u5347Web\u5e94\u7528\u7684\u7528\u6237\u4f53\u9a8c\u548c\u6570\u636e\u53ef\u89c6\u5316\u80fd\u529b\u3002","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/www.silicloud.com\/zh\/blog\/primefaces-\u6811tree\u3001\u6811\u8282\u70b9treenode\u3001\u6811\u8868treetable-\u793a\u4f8b\u6559\u7a0b\/","og_locale":"zh_CN","og_type":"article","og_title":"PrimeFaces\u6811\u5f62\u7ec4\u4ef6\u6df1\u5ea6\u6559\u7a0b\uff1aTree\u3001TreeNode\u4e0eTreeTable\u5b9e\u6218\u6307\u5357","og_description":"\u672c\u6559\u7a0b\u8be6\u7ec6\u8bb2\u89e3PrimeFaces\u6846\u67b6\u4e2d\u5f3a\u5927\u7684\u6811\u5f62\u7ec4\u4ef6\uff0c\u5305\u62ecTree\uff08\u6811\uff09\u3001TreeNode\uff08\u6811\u8282\u70b9\uff09\u548cTreeTable\uff08\u6811\u8868\uff09\u7684\u7528\u6cd5\u3002\u901a\u8fc7\u4e30\u5bcc\u7684\u793a\u4f8b\u4ee3\u7801\uff0c\u52a9\u60a8\u8f7b\u677e\u638c\u63e1PrimeFaces\u6811\u5f62\u7ed3\u6784\u7684\u521b\u5efa\u3001\u6570\u636e\u7ed1\u5b9a\u3001\u4e8b\u4ef6\u5904\u7406\u53ca\u9ad8\u7ea7\u5b9a\u5236\uff0c\u63d0\u5347Web\u5e94\u7528\u7684\u7528\u6237\u4f53\u9a8c\u548c\u6570\u636e\u53ef\u89c6\u5316\u80fd\u529b\u3002","og_url":"https:\/\/www.silicloud.com\/zh\/blog\/primefaces-\u6811tree\u3001\u6811\u8282\u70b9treenode\u3001\u6811\u8868treetable-\u793a\u4f8b\u6559\u7a0b\/","og_site_name":"Blog - Silicon Cloud","article_published_time":"2022-11-07T14:02:14+00:00","article_modified_time":"2025-07-31T18:40:16+00:00","author":"\u6587, \u7fd4","twitter_card":"summary_large_image","twitter_misc":{"\u4f5c\u8005":"\u6587, \u7fd4","\u9884\u8ba1\u9605\u8bfb\u65f6\u95f4":"6 \u5206"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/www.silicloud.com\/zh\/blog\/primefaces-%e6%a0%91tree%e3%80%81%e6%a0%91%e8%8a%82%e7%82%b9treenode%e3%80%81%e6%a0%91%e8%a1%a8treetable-%e7%a4%ba%e4%be%8b%e6%95%99%e7%a8%8b\/","url":"https:\/\/www.silicloud.com\/zh\/blog\/primefaces-%e6%a0%91tree%e3%80%81%e6%a0%91%e8%8a%82%e7%82%b9treenode%e3%80%81%e6%a0%91%e8%a1%a8treetable-%e7%a4%ba%e4%be%8b%e6%95%99%e7%a8%8b\/","name":"PrimeFaces\u6811\u5f62\u7ec4\u4ef6\u6df1\u5ea6\u6559\u7a0b\uff1aTree\u3001TreeNode\u4e0eTreeTable\u5b9e\u6218\u6307\u5357 - Blog - Silicon Cloud","isPartOf":{"@id":"https:\/\/www.silicloud.com\/zh\/blog\/#website"},"datePublished":"2022-11-07T14:02:14+00:00","dateModified":"2025-07-31T18:40:16+00:00","author":{"@id":"https:\/\/www.silicloud.com\/zh\/blog\/#\/schema\/person\/64d5cc7727fffbff2f9a2a8da1de3e5c"},"description":"\u672c\u6559\u7a0b\u8be6\u7ec6\u8bb2\u89e3PrimeFaces\u6846\u67b6\u4e2d\u5f3a\u5927\u7684\u6811\u5f62\u7ec4\u4ef6\uff0c\u5305\u62ecTree\uff08\u6811\uff09\u3001TreeNode\uff08\u6811\u8282\u70b9\uff09\u548cTreeTable\uff08\u6811\u8868\uff09\u7684\u7528\u6cd5\u3002\u901a\u8fc7\u4e30\u5bcc\u7684\u793a\u4f8b\u4ee3\u7801\uff0c\u52a9\u60a8\u8f7b\u677e\u638c\u63e1PrimeFaces\u6811\u5f62\u7ed3\u6784\u7684\u521b\u5efa\u3001\u6570\u636e\u7ed1\u5b9a\u3001\u4e8b\u4ef6\u5904\u7406\u53ca\u9ad8\u7ea7\u5b9a\u5236\uff0c\u63d0\u5347Web\u5e94\u7528\u7684\u7528\u6237\u4f53\u9a8c\u548c\u6570\u636e\u53ef\u89c6\u5316\u80fd\u529b\u3002","breadcrumb":{"@id":"https:\/\/www.silicloud.com\/zh\/blog\/primefaces-%e6%a0%91tree%e3%80%81%e6%a0%91%e8%8a%82%e7%82%b9treenode%e3%80%81%e6%a0%91%e8%a1%a8treetable-%e7%a4%ba%e4%be%8b%e6%95%99%e7%a8%8b\/#breadcrumb"},"inLanguage":"zh-Hans","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.silicloud.com\/zh\/blog\/primefaces-%e6%a0%91tree%e3%80%81%e6%a0%91%e8%8a%82%e7%82%b9treenode%e3%80%81%e6%a0%91%e8%a1%a8treetable-%e7%a4%ba%e4%be%8b%e6%95%99%e7%a8%8b\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/www.silicloud.com\/zh\/blog\/primefaces-%e6%a0%91tree%e3%80%81%e6%a0%91%e8%8a%82%e7%82%b9treenode%e3%80%81%e6%a0%91%e8%a1%a8treetable-%e7%a4%ba%e4%be%8b%e6%95%99%e7%a8%8b\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"\u9996\u9875","item":"https:\/\/www.silicloud.com\/zh\/blog\/"},{"@type":"ListItem","position":2,"name":"PrimeFaces\u6811\u5f62\u7ec4\u4ef6\u6df1\u5ea6\u6559\u7a0b\uff1aTree\u3001TreeNode\u4e0eTreeTable\u5b9e\u6218\u6307\u5357"}]},{"@type":"WebSite","@id":"https:\/\/www.silicloud.com\/zh\/blog\/#website","url":"https:\/\/www.silicloud.com\/zh\/blog\/","name":"Blog - Silicon Cloud","description":"","inLanguage":"zh-Hans"},{"@type":"Person","@id":"https:\/\/www.silicloud.com\/zh\/blog\/#\/schema\/person\/64d5cc7727fffbff2f9a2a8da1de3e5c","name":"\u6587, \u7fd4","image":{"@type":"ImageObject","inLanguage":"zh-Hans","@id":"https:\/\/www.silicloud.com\/zh\/blog\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/920c3d673e0bccacc98e5e6b7149bb3c22edd8d39cb753e5d7d7e471498118a1?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/920c3d673e0bccacc98e5e6b7149bb3c22edd8d39cb753e5d7d7e471498118a1?s=96&d=mm&r=g","caption":"\u6587, \u7fd4"},"url":"https:\/\/www.silicloud.com\/zh\/blog\/author\/wenxiang\/"},{"@type":"ImageObject","inLanguage":"zh-Hans","@id":"https:\/\/www.silicloud.com\/zh\/blog\/primefaces-%e6%a0%91tree%e3%80%81%e6%a0%91%e8%8a%82%e7%82%b9treenode%e3%80%81%e6%a0%91%e8%a1%a8treetable-%e7%a4%ba%e4%be%8b%e6%95%99%e7%a8%8b\/#local-main-organization-logo","url":"","contentUrl":"","caption":"Blog - Silicon Cloud"}]}},"_links":{"self":[{"href":"https:\/\/www.silicloud.com\/zh\/blog\/wp-json\/wp\/v2\/posts\/227","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.silicloud.com\/zh\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.silicloud.com\/zh\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.silicloud.com\/zh\/blog\/wp-json\/wp\/v2\/users\/6"}],"replies":[{"embeddable":true,"href":"https:\/\/www.silicloud.com\/zh\/blog\/wp-json\/wp\/v2\/comments?post=227"}],"version-history":[{"count":4,"href":"https:\/\/www.silicloud.com\/zh\/blog\/wp-json\/wp\/v2\/posts\/227\/revisions"}],"predecessor-version":[{"id":109709,"href":"https:\/\/www.silicloud.com\/zh\/blog\/wp-json\/wp\/v2\/posts\/227\/revisions\/109709"}],"wp:attachment":[{"href":"https:\/\/www.silicloud.com\/zh\/blog\/wp-json\/wp\/v2\/media?parent=227"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.silicloud.com\/zh\/blog\/wp-json\/wp\/v2\/categories?post=227"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.silicloud.com\/zh\/blog\/wp-json\/wp\/v2\/tags?post=227"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}