Lodash对象阵列在对象阵列内

Question

"info": { 
    "core": [{ 
     "name": "User", 
     "fields": [{ 
      "field": "name", 
     }, { 
      "field": "age", 
     }] 
    }, { 
     "name": "Post", 
     "fields": [{ 
      "field": "title", 

     }, { 
      "field": "body", 
     }, { 
      "field": "author", 
     }] 
    }] 
} 

如何映射这些结构数据。我想实现的Web视图是这样的：

1.

• 名称值
• 领域
  • 字段值
  • 字段值

2 。

个

• 名称值
• 领域
  • 字段值
  • 字段值

等等...

我尝试使用lodash地图的样子这些，它是一个好方法？

const info = _.map(info.core, function (value: any) { 
    const fields = _.map(value.fields, function (fields: any) { 
    return field; 
    }); 

    const demo = { 
    name: name, 
    fields: fields.join('') 
    }; 

    return demo; 
}); 

console.log(demo); 

Answer 1

不知道为什么你甚至需要映射。也许我误解了这个问题。

如果你想渲染这个数据，只是解析它，你应该不需要更多的转换。

下面我用文件撰写只是为了简单，但更好的方法是直接的createElement等

var info = { 
 
    "core": [{ 
 
     "name": "User", 
 
     "fields": [{ 
 
      "field": "name", 
 
     }, { 
 
      "field": "age", 
 
     }] 
 
    }, { 
 
     "name": "Post", 
 
     "fields": [{ 
 
      "field": "title", 
 

 
     }, { 
 
      "field": "body", 
 
     }, { 
 
      "field": "author", 
 
     }] 
 
    }] 
 
} 
 

 
var w = document.write.bind(document); 
 

 
info.core.forEach((c,i) => { 
 
    w(`<p>${i+1}.</p>`); 
 
    w('<ul>'); 
 
    w(`<li>${c.name}</li>`); 
 
    w('<li>fields'); 
 
    w('<ul>'); 
 
    c.fields.forEach((f) => { 
 
    w(`<li>${f.field}</li>`); 
 
    }); 
 
    w('</ul>'); 
 
    w('</li>'); 
 
    w('</ul>'); 
 
});