Question

我在我的代码中使用聚合物纸树元素。它使用静态数据完美地显示树，但是当我尝试动态添加项时，它不起作用。我在这里附上截图。enter image description here

//数组

    this.itemArray = {"name": "Project",
                                                "icon": "theaters",
                                                "open": true,
                                                "children": [{
                                                    "name": "Quotes",
                                                    "icon": "theaters",
                                                     "open": true,
                                                    "children": [{
                                                      "name": "Breaking Bad",
                                                        "icon": "theaters"
                                                    }]
                                                }, {
                                                    "name": "Templates",
                                                    "icon": "theaters",
                                                     "open": true,
                                                    "children": [{
                                                        "name": "Breaking Bad",
                                                        "icon": "theaters"
                                                    }, {
                                                        "name": "Game of Thrones",
                                                        "icon": "theaters"
                                                    }]
                                                }]
                                      }

   //Js code which accepts value from a text box and adds it to the array.


 this.$.additem.addEventListener("click", function(){

enter code herevar data = self.$.txtData.value;
                                                                           self.itemArray.children[1].children.push(
                                          {'name':data,
                                           'icon':'theaters'});

                                          self.addData(self.itemArray,data);
                                          self.$.txtData.value = " ";


                                  });

// addData function



addData:function(itemsarr){
                      console.log("calling items array function",this.tree);
                      var tempArr = [];
                      tempArr = itemsarr;
                      if(this.tree){
                       this.$.temp.removeChild(this.tree);
                       //tempArr = itemsarr; //= this.itemArray2;
                      }

                      this.tree = document.createElement('paper-tree-node');
                      this.tree.setAttribute('id','treemenu');
                      this.$.temp.appendChild(this.tree);
                      this.tree.data = tempArr;
                      console.log(tempArr);

      }

Answer 1

聚合物纸树具有数据属性。你只需要更新它。

帮助链接：https://github.com/vpusher/paper-tree/blob/master/paper-tree.html

如何动态添加项目到聚合物纸树？

1 个答案: