Javascript 如何将来自Mongoose的JSON映射到Vue和Quasar?

Javascript 如何将来自Mongoose的JSON映射到Vue和Quasar?,javascript,json,vue.js,mongoose,quasar-framework,Javascript,Json,Vue.js,Mongoose,Quasar Framework,我有一个Mongoose后端,并编写了一些RESTAPI来向我的Vue/Quasar前端提供数据。它仍然是基本的,使用Node/expresshttp进行API调用,还没有Axios之类的。我使用了一些简单的CRUD get/put/post/delete API,但现在有一个更复杂的API,它基于特定的Mongoose查询来返回节点的子节点 Mongoose以以下格式向我提供数据: {“kinder”: [ {name: value, …}, {name: value, …} ] } 这

我有一个Mongoose后端,并编写了一些RESTAPI来向我的Vue/Quasar前端提供数据。它仍然是基本的,使用Node/expresshttp进行API调用,还没有Axios之类的。我使用了一些简单的CRUD get/put/post/delete API,但现在有一个更复杂的API,它基于特定的Mongoose查询来返回节点的子节点

Mongoose以以下格式向我提供数据:

{“kinder”: [ {name: value, …}, {name: value, …} ] }  
这似乎是一个包裹在对象中的数组。我不知道如何在Mongoose/后端端更改该格式

前端的Vue和类星体需要消耗一些(不是全部)来自猫鼬的这些值,但他们希望它以

[ {name: value, ...}, {name: value, ...} ]
我需要插入一些新的名称:值对供Quasar使用,除了从后端引入的内容

在从Vue组件的onLazyload方法执行REST调用之后,为了从后端获取子项,我可以在Chrome Vue工具中完美地看到子项,因此我认为REST API调用可以按设计工作。它还可以直接通过localhost:8080/api/baustoff/kinder/完美地工作,以上述格式提供孩子

我的问题是在REST调用之后,将REST响应数据映射到Vue/Quasar所需的内容,该代码也在onLazyLoad方法中(见下文)

我尝试了对下面代码的各种更改,例如使用JSON.parse,正如其他地方所建议的那样,但失败了。我认为主要的问题是如何处理这个嵌套数组

以下是Vue组件一侧的代码(onLazyLoad方法),该代码不起作用:

onLazyLoad({ node, key, done, fail }) {
      let parent_id = node._id; 
      // REST call to get the children of a parent node from Mongoose
      http
        .get("/baustoff/kinder/"+parent_id)
        .then(response => {
            // If no children, return empty tree array
          if (response.data == null) {
            done([]);
            return;
          }
          // Process to create Vue/Quasar QTree array with data from REST
          // PROBLEMATIC CODE STARTS PROBABLY HERE!!!!!!!!!!!!!!!
          let donvis = response.data;
          let treeNodes = []; // array to prep the children as needed by QTree 
          for (let i = 0; i < donvis.length; i++) {
                 treeNodes[i] = {
                 fachlicherTyp: donvis[i].fachlicherTyp,
                 _id: donvis[i]._id,
                 lazy: true,
                 parent_id: parent_id, 
               };    
          }
          done(treeNodes); //Draw tree by Quasar/vue QTree
          this.treeChange++; // Marking tree change to Quasar
          return null;
      })
        .catch(e => {
          console.log(e);
        });
    }, // /onLazyLoad()

如果我理解正确,donvis是来自mongoose的数据,mongoose是一个对象。 对象没有长度属性

你应该试试这个:

donvis.kinder.forEach(child => {
  treeNodes.push({
    fachlicherTyp: child.fachlicherTyp,
    _id: child._id,
    lazy: true,
    parent_id: parent_id,
  })
})
我使用forEach是因为我认为它使事情更可读。如果你不知道怎么用,告诉我


请注意,我还使用了treeNodes.push(…)而不是treeNodes[I]=。。。这是一种更标准的填充数组的方法

谢谢@bastien girschig。工作完美。你救了我一个晚上。我把“孩子们”改成了“金德”,因为我以前在原帖中编辑过。它是猫鼬种群的主体属性的原始名称。
donvis.kinder.forEach(child => {
  treeNodes.push({
    fachlicherTyp: child.fachlicherTyp,
    _id: child._id,
    lazy: true,
    parent_id: parent_id,
  })
})