javascript - jstree 中只调用了 1 个文件夹

Question

我目前正在尝试 jstree 在我的 Dropbox API 中列出我的文件夹，但只显示 1 个文件夹，但我的保管箱中必须有 2 个文件夹。但是当我控制台该功能 console.log(entry); 时reposnse 是显示的 2 个文件夹，但是当我将函数放入 jstree 的数据时，仅显示 1 个文件夹，并且该文件夹是 console.log(entry); 中的最后一个 reposnse

var dbx = new Dropbox({ accessToken: access_token1 });
dbx.filesListFolder({ path: "" })
  .then(function(response) {

    response.entries.forEach(function(entry) {
      if (entry.tag == 'folder') {
        entry.parent = '#'
      }
      entry.text = entry.name
      console.log(entry);
      console.log(entry.name);

      $("#people").jstree({
        // generating tree from json data
        "json_data": {
          "data": {
            "data": entry.name,
            "state": "closed",
          },

        },
        // plugins used for this tree
        "plugins": ["json_data", "ui", "types", "crrm"]
      })

      .bind("loaded.jstree", function() {
          // do stuff when tree is loaded
          $("#people").addClass("jstree-sugar");
          $("#people > ul").addClass("list");
          $("#people > ul > li > a").addClass("jstree-clicked");
        })
        .bind("select_node.jstree", function(e, data) {
          // do stuff when a node is selected
          data.inst.toggle_node(data.rslt.obj);

        });
    })

    ///end of response
  })
  .catch(function(error) {
    console.log(error);
  });

Answer 1

您应该将 jsTree 生成移出响应迭代，否则您始终只能看到树中的最后一个文件夹。

如果您使用过 jsTree v3(我猜您没有使用过)，您可以使用下面的代码。另请查看演示 - Fiddle Demo .

var dbx = new Dropbox({ accessToken: access_token1 });
dbx.filesListFolder({ path: "" })
  .then(function(response) {

    var nodes = []; // store the nodes

    response.entries.forEach(function(entry) {
      if (entry.tag == 'folder') {
        entry.parent = '#'
      }

      // add nodes to array - you will also need id for every node
      // to properly map files to folders in the tree
      nodes.push({
         id: entry.id,
         parent: entry.parent,
         text: entry.name
      });

      console.log(entry);
      console.log(entry.name);
    })

    // tree config out of the response iteration
    $("#people").jstree({
        // generating tree from json data
        "core": {
          "data": nodes   // pass nodes to tree config
          }
        },
        // plugins used for this tree
        "plugins": ["json_data", "ui", "types", "crrm"]
      })
      .on("loaded.jstree", function() {
        // do stuff when tree is loaded
        $("#people").addClass("jstree-sugar");
        $("#people > ul").addClass("list");
        $("#people > ul > li > a").addClass("jstree-clicked");
      })
      .on("select_node.jstree", function(e, data) {
        // do stuff when a node is selected
        data.inst.toggle_node(data.rslt.obj);

      });


    ///end of response
  })
  .catch(function(error) {
    console.log(error);

  });