Element.ui treeコンポーネントを使用してVue(クラウドディスクのようなもの)にSPAを作成し、フォルダツリーを表示します。問題は、ツリー自体がすべてを一度にロードするのではなく、遅延修飾子の助けを借りて順次ロードされることです。Vue Element.uiツリー、reitイベントを発行
サーバ部分はmongoose + mongoose-path-treeです。各ノードは、その子を知りませんが、子どもたちはルート要素への完全なパスを格納します:マングースパスツリーの使用は、データベース内のツリー記憶方式は次であることを、意味
#root_id #subroot_id # ... #parent_id #this_id
問題は、ユーザーがツリーに変更を加え(ファイルをロードし、新しいフォルダを作成するなど)、サーバーがそれらを受け入れると、新しいデータを読み込む必要があることをツリーに通知する方法です。ドキュメントの要素uiには、ツリーの再描画を引き起こすイベントをキャプチャする方法は記載されていません。
クライアントツリーのテンプレート新しいノードに
loadNode: async function (node, resolve) {
try {
let firstGeneration = await foldersAPI.get(this.$store.state.user.myDrive);
if (node.level === 0) {
return resolve(firstGeneration.data.folder.children);
} else {
var data;
if (node.data.hasChildren) {
let children = await foldersAPI.get(node.data._id);
console.log(children);
data = children.data.folder.children;
} else {
data = [];
}
resolve(data);
}
} catch (e) {
console.log(e)
}
しかし、私は遅延ロードを使用しているので、計算された小道具を使用することはできません。 Ecsual、element-uiツリーで遅延ロードを使用すると、ツリーコンポーネントからデータを取得できない – ZulusK