EASYUI TREEGRID Implementierungsmethode für asynchrones Laden von Daten

Ich werde das offizielle Ex von Treegrid veröffentlichen, damit jeder es sich ansehen kann:

$(function(){ 
$('#tt').treegrid({ 
url:'treegrid_data3.json', 
onAfterEdit:function(row,changes){ 
alert(row.name); 
} 
}); 
})

Dies dient der Seiteninitialisierung.
Sehen Sie sich seinen JSON an:

{"total":117,"rows":[ 
<SPAN style="COLOR: #ff0000">{"id":1,"code":"code1","name":"name1","addr":"address1","state":"closed"},</SPAN> 
{"id":11,"code":"code11","name":"name11","addr":"address11","<SPAN style="COLOR: #ff0000">_parentId":1</SPAN>}, 
{"id":12,"code":"code12","name":"name12","addr":"address12","<SPAN style="COLOR: #ff0000">_parentId":1</SPAN>}, 
{"id":21,"code":"code21","name":"name21","addr":"address21","_parentId":1}, 
{"id":22,"code":"code22","name":"name22","addr":"address22","_parentId":1}, 
{"id":31,"code":"code31","name":"name31","addr":"address31","_parentId":1}, 
{"id":32,"code":"code32","name":"name32","addr":"address32","_parentId":1}, 
{"id":41,"code":"code41","name":"name41","addr":"address41","_parentId":1}, 
{"id":42,"code":"code42","name":"name42","addr":"address42","_parentId":1}, 
{"id":51,"code":"code51","name":"name51","addr":"address51","_parentId":1}, 
{"id":52,"code":"code52","name":"name52","addr":"address52","_parentId":1}, 
{"id":61,"code":"code61","name":"name61","addr":"address61","_parentId":1}, 
{"id":62,"code":"code62","name":"name62","addr":"address62","_parentId":1}, 
{"id":71,"code":"code71","name":"name71","addr":"address71","_parentId":1}, 
{"id":72,"code":"code72","name":"name72","addr":"address72","_parentId":1}, 
{"id":81,"code":"code81","name":"name81","addr":"address81","_parentId":1}, 
{"id":82,"code":"code82","name":"name82","addr":"address82","_parentId":1}, 
{"id":91,"code":"code91","name":"name91","addr":"address91","_parentId":1}, 
{"id":92,"code":"code92","name":"name92","addr":"address92","_parentId":1}, 
{"id":110,"code":"code110","name":"name110","addr":"address110","_parentId":1}, 
{"id":120,"code":"code120","name":"name120","addr":"address120","_parentId":1} 
]}

Die rot markierten Stellen sind besonders nützlich. Ich habe selbst einen erstellt, aber es gab immer keine Daten 🎜>

{"total":29,"rows":[ 
{"Id":25,"Ids":25,"name":"直辖市","state":"closed",<SPAN style="COLOR: #ff0000">"_parentId":2</SPAN>,"orderId":2}, 
{"Id":44,"Ids":44,"name":"黑龙江","state":"closed","_parentId":2,"orderId":110}, 
{"Id":45,"Ids":45,"name":"吉林","state":"closed","_parentId":2,"orderId":1}, 
{"Id":46,"Ids":46,"name":"辽宁","state":"closed","_parentId":2,"orderId":3}, 
{"Id":47,"Ids":47,"name":"河北","state":"closed","_parentId":2,"orderId":4}, 
{"Id":48,"Ids":48,"name":"内蒙古","state":"closed","_parentId":2,"orderId":111}, 
{"Id":49,"Ids":49,"name":"山西","state":"closed","_parentId":2,"orderId":6}, 
{"Id":50,"Ids":50,"name":"江西","state":"closed","_parentId":2,"orderId":11}, 
{"Id":51,"Ids":51,"name":"山东","state":"closed","_parentId":2,"orderId":12}, 
{"Id":52,"Ids":52,"name":"台湾","state":"closed","_parentId":2,"orderId":13}, 
{"Id":53,"Ids":53,"name":"甘肃","state":"closed","_parentId":2,"orderId":15}, 
{"Id":54,"Ids":54,"name":"宁夏","state":"closed","_parentId":2,"orderId":16}, 
{"Id":55,"Ids":55,"name":"青海","state":"closed","_parentId":2,"orderId":17}, 
{"Id":56,"Ids":56,"name":"新疆","state":"closed","_parentId":2,"orderId":18}, 
{"Id":57,"Ids":57,"name":"云南","state":"closed","_parentId":2,"orderId":19}]}

Die oben genannten Daten haben keinen Wurzelknoten, daher gibt es nichts auf der Seite. . . . . Meine Daten haben nur parentId, daher ist die Seite leer.

Dieses Problem wurde behoben, es ist jedoch ein neues Problem aufgetreten. Zuerst bestand meine Methode darin, alle Daten direkt zu laden und auf den Knoten zu klicken, um ihn zu erweitern. Es gab kein Problem. Das Laden aller Daten zusammen verbraucht jedoch nicht nur Leistung, sondern ist auch extrem langsam.
Also dachte ich an asynchrones Laden. Ich bin lange auf die offizielle Website gegangen und habe sie mir angeschaut. Auf der offiziellen Website waren viele Ereignisse zu finden, z. B. Erweiterungsauslöser usw., aber keines davon war auf den Punkt gebracht.
Ich habe Firefox verwendet, um zu überwachen, dass die Daten jedes Mal geladen wurden und das richtige JSON zurückgegeben wurde

{"total":29,"rows":[ 
{"Id":25,"Ids":25,"name":"直辖市","state":"closed",<SPAN style="COLOR: #ff0000">"_parentId":2</SPAN>,"orderId":2}, 
{"Id":44,"Ids":44,"name":"黑龙江","state":"closed","_parentId":2,"orderId":110},

. . . .
Nachdem ich den Baum wiederholt mit diesem Baumgitter verglichen habe. Schließlich habe ich herausgefunden, dass „Treegrid“ die angeforderten Daten über „total“ und „rows“ verfügt, Tree jedoch nicht.

Könnte es sein, dass die Summe und die Zeilen Probleme verursachten? Ich habe das schnell gelöscht und tatsächlich kamen die Daten heraus

Sie können auf Baidu suchen, es gibt verschiedene Meinungen.

Die letzte Zusammenfassung: Bitte beachten Sie:

　1. Es muss ein Wurzelknoten vorhanden sein.

2. Das vom übergeordneten Knoten geladene Datenformat Die vom untergeordneten Knoten geladenen Daten haben ein anderes Format.
Der übergeordnete Knoten erfordert Summen und Zeilen, während der untergeordnete Knoten beim Laden dasselbe Datenformat wie der Baum benötigt. Bisher habe ich nur ein zweistufiges Modell erstellt und das mehrstufige Modell habe ich noch nicht ausprobiert. Speichern Sie diesen Artikel zum späteren Nachschlagen.

Weitere Artikel zur asynchronen Ladedatenimplementierungsmethode EASYUI TREEGRID finden Sie auf der chinesischen PHP-Website!