ELEMENT’s EL-Tree Control Brempraction Data Structure and Extract

Recently used the EL-Tree control, mainly the format of the data, and the tree structure of the node can be displayed according to the data format of the official website.
Code References

Here is a better link: https://www.jb51.net/Article/181990.htm

Code Description It has been written in detail in the comment, which is no longer described here. As for why the data is extracted into this format, it is because of the data format specified in ElementUI-Tree, you want to use this control, you must follow the formats they specify.

Element的el-tree控件后台数据结构的生成以及方法的抽取 Controller code

@RequestMApping (“/ catelist”) @Responsebody public list
 catelist () {// Overall Ideas: // 1, acquire all data, put the collection list1 (tbcategories) // 2, put the LIST1 all data into map (TreeMap): Elements The ID is the key, the element itself is value // 3, the top-level node is obtained in the collection list2 // 4, traversed all the data in List1, and the ParentID of the data is used in Map // 1) If it can be taken, then the element has parent node // 1, determined whether there is a subtode // 1 in the childlist under the parent node, if there is:, create a collection, put the child node in // 2, if Yes:, put the child node directly to // 5, put the putted data back to the map //6, return List1 (Resultlist) // Note:The whole process takes all the data into List2 (Resultlist), returned to // list2 list  tbcategories = categoryService.catelist (); list  resultlist = new arraylist  (); // Storage top layer Data MAP  treemAp = new hashmap (); object itemtree; for (int i = 0; i  ());} category.getChildlist (). Add (tbcategories.get (i)); // CHILDLIST collection to the parent node // This step is actually not because we modified data (add the child node, then put the element into the map, // If the key is the same, the MAP will automatically overwrite the same Key value pair, reach the purpose of updating the data in the map of the map), but we // This is just from the map, and the child node that does not care is (the child node is the object itself. Here we know // The element is placed from the query into the map, the parent node is placed in the list, and then the object is obtained in the map, then the modified object is re-placed in the map, and we have not directly operated List, but in LIST The value of the object has been modified, which is the reference to the object, the same reference object is operated by // address value, that is, different references, but the attribute in the object is the operation that has been referenced. When you change it, once you modified, whether it is MAP or List, it is already a changed value when you value it again.) TreeMap.Put (tbcategories.get (i) .GetParentId (), CATEGORY); // put the putted data back to the map}} returnratelist;}  <tbCategories.size() && !tbCategories.isEmpty();i++){
      itemTree = tbCategories.get(i);
      treeMap.put(tbCategories.get(i).getNodeId(),tbCategories.get(i));// 把所有的数据都放到map中


    }


// 这里也可以用另一种方法,就是拿到集合里的每个元素的父id去数据库中查询,但是,这样与数据库的交互次数就太多了
 // 遍历map得到顶层节点(游离节点也算作顶层节点)
    for(int i =0;i<tbCategories.size();i++){
      // 优点1:整个方法,只查询了一次数据库
      // 优点2:不用知道顶层节点的id
     if(!treeMap.containsKey(tbCategories.get(i).getParentId())){
        // 我们在存储的时候就是将元素的id为键,元素本身为值存入的
        // 以元素的父id为键,在map里取值,若取不到则,对应的元素不存在,即没有父节点,为顶层节点或游离节点
        // 将顶层节点放入list集合
        resultList.add(tbCategories.get(i));
      }
    }

    // 循环数据,将数据放到该节点的父节点的children属性中
    for(int i =0 ;i<tbCategories.size()&& !tbCategories.isEmpty();i++){
      // 数据库中,若一个元素有子节点,那么,该元素的id为子节点的父id
      //treeMap.get(tbCategories.get(i).getParentId()); // 从map集合中找到父节点
      TbCategory category = (TbCategory)treeMap.get(tbCategories.get(i).getParentId());
      if(category!=null ){ // 不等于null,也就意味着有父节点
        // 有了父节点,要判断父节点下存贮字节点的集合是否存在,然后将子节点放入
        if(category.getChildList() == null){
          // 判断一个集合是否被创建用null:表示结合还没有被分配内存空间(即还没有被创建),内存大小自然为null
          // 用集合的size判断集合中是否有元素,为0,没有元素(集合已经被创建),
          category.setChildList(new ArrayList  
physical classes:

Private string categoryName; private long parentid; private long childid; private long childid; private list
 childlist;    
The above data is in the background.

 JS:   JS:   
Defaultprops: {children: ‘childlist’, label: ‘categoryName’ // The name here is the same as the name of the node in the data you encapsulated.} // Click Events HandlenodeClick: Function (DATA) {Console.Log (“Did not do processing”);}

Method extraction

 above Although the method can be used, it wants to extract this method into a general method. When it is written, it will be directly to the method. There are still many problems during the extraction process.   For example, the physical class A is a physical class that stores a table in which the node stores nodes in the database, but there is no setChildList, Getchil in the physical class.Dlist set these methods. I wrote the fields of these storage information in a tool class, then the method is also in the tool class. This is necessary to return a collection of the tool class when you return. There is also a question that you need those fields in the tool class? Because it is a tree, we need a node ID, a few parent ID, nodes, and a collection of stored subtitles. If you want more data, you can add a T Data generic, which will be directly The physical clashot of the original storage node is stored. Thus all the data is neat, the data structure is complete. 
Contrall code:

Because we want to draw a public method, the type of parameters is uncertain, that is, the type of element in incoming list is not fixed, So use generics. The above is said, we have to get the node ID, the parent ID, and the name of the node assignment to the corresponding fields in the tool class. But since it is using a generic, it doesn’t know the object type, so we don’t know the corresponding method in the tool class, we will use the specific field or method for reflection and reflection. The name is to take the value, so we will incorporate the node ID, the parent ID, and node name when the controller is invoking the tool class. Of course, it is necessary to pass to query the List collection of the loaded data from the background. Contreller code as follows:

@RequestMapping (“/ catelist”) @RESPONSEBODYPUBLIC LIST

CATELIST () throws exception { List

tbcategories = categoryService.catelist (); list

treelist = treeutils.gettreeList (TBCategories, “NodeID”, “ParentID”, “categoryName”);



// When extracting a method, consider a problem, that is, Returns a collection, the parent node and the word segment point, the parent node, and the type point of the parent node must be unified, // The return here is a collection of treeutils type, then the parent node and the child node in the collection must be It has to be a treeutils type public class tree (123) {private integer; // node ID private integeridId; // Parent Name Private String Name; // Node name, return to the front desk is a collection of treeutils Data, so when the data is displayed in the front desk, the name of the EL-Tree’s LABLE and this kind of private list

childlist; // Parent T Data; // Node Data

[// Node Data
     / ** * @Param ListData // Data from the database * @Return * / public static list  gettreelist (List 
ListData, String ID, String Parentid, String CategoryName) THROWS Exception {list resultlist = new arraylist
(); // Finally returned the result MAP

MAP = new hashMap

(); for (int I = 0; i
 Reflection method     
/ ** * is not necessarily not necessary by reflecting the data type, so we return the value to Object * Object is unable to transfer to Integer, now convert the object to integer * @Param to convert String to Integer * @Param item * @param fileName * @return * / public static Object getFileValue (Object item, String fileName) throws Exception {Class aClass = item.getClass (); Field file = aClass.getDeclaredField (fileName); // get all Fields include private field file.setAccessible (TRUE); // Cancel access restriction return file.get (item); // This reflects the meaning of reflection, we usually get a field through the object, here is through the field, Get a value of the type of bytecode object to get the value}

PS: The extraction method has encountered a lot of problems, of which T, “is also a generic Just simply use, is not skilled, you will learn more.
  This article about the generation of ELEMENT EL-TREE controls the generation of the background data structure and the extraction of the extracted article, more Multiple related ELEMENT EL-TREE generation and method Extraction, please search TUMI cloud previous article or continue to browse the following related articles I hope you will support TUMI cloud!                      
© Copyright Notice
THE END
Just support it if you like
like0
share
comment Grab the couch

Please log in to comment