Layui完成树形下拉框

效果是这样的。主要是结合项目完成效果。这里先创建一个实体类：

@Data
public class ATree extends TreeNode{

  private String name;
}

接下来是父类：

@Data
public class TreeNode {
	protected int id;
	protected int parentId;
	protected List children = new ArrayList();

	public void add(TreeNode node) {
		children.add(node);
	}
}

基石搭建好了，下面是使用，那么使用时有一个工具类：

import lombok.experimental.UtilityClass;

import java.util.ArrayList;
import java.util.List;

/**
 * 
 */
@UtilityClass
public class TreeUtil {
	/**
	 * 两层循环实现建树
	 *
	 * @param treeNodes 传入的树节点列表
	 * @return
	 */
	public  List buildByLoop(List treeNodes, Object root) {

		List trees = new ArrayList<>();

		for (T treeNode : treeNodes) {

			if (root.equals(treeNode.getParentId())) {
				trees.add(treeNode);
			}

			for (T it : treeNodes) {
				if (it.getParentId() == treeNode.getId()) {
					if (treeNode.getChildren() == null) {
						treeNode.setChildren(new ArrayList<>());
					}
					treeNode.add(it);
				}
			}
		}
		return trees;
	}

	/**
	 * 使用递归方法建树
	 *
	 * @param treeNodes
	 * @return
	 */
	public  List buildByRecursive(List treeNodes, Object root) {
		List trees = new ArrayList();
		for (T treeNode : treeNodes) {
			if (root.equals(treeNode.getParentId())) {
				trees.add(findChildren(treeNode, treeNodes));
			}
		}
		return trees;
	}

	/**
	 * 递归查找子节点
	 *
	 * @param treeNodes
	 * @return
	 */
	public  T findChildren(T treeNode, List treeNodes) {
		for (T it : treeNodes) {
			if (treeNode.getId() == it.getParentId()) {
				if (treeNode.getChildren() == null) {
					treeNode.setChildren(new ArrayList<>());
				}
				treeNode.add(findChildren(it, treeNodes));
			}
		}
		return treeNode;
	}

}

工具类建好以后，写接口请求数据

这里直接上service层的代码，其他的只是单纯的基本方法：

@Override
    public String getLayuiList() {
        List propertyTree = this.getTree(要查询的树形结构数据列表);

        return JsonUtils.toJson(propertyTree);
    }
    /**
     *属性结构
     * @param list
     * @return
     */
    private List getTree(List<实体类> list){
        List treeList = list.stream()
                .filter(pro -> !pro.属性().equals(pro.属性()))
                .map(pro -> {
                    ATree node = new ATree();
                    node.setId(Integer.parseInt(pro.getCode()));
                    node.setParentId(Integer.parseInt(pro.getPcode()));
                    node.setName(pro.getName());
                    return node;
                }).collect(Collectors.toList());
        return TreeUtil.buildByLoop(treeList, 0);
    }
}

以上是最主要的方法，这里用的表结构里是有父子节点的表结构。

注：后台返回的数据是list，然后转成了json型的string，获取的数据就是layui中的nodes里的数据。

因为用的不是前后端分离的，所以这里直接赋值nodes

下面是页面：

                分类
                

                

                    

                        选择
                        
                        
                    
                    

                   

                       

                   
               
                
                

//以上是部分数据，可能有些样式会不一样的，具体再自己解决吧

具体的要具体使用，这里在我使用的项目中还是可以使用的。