使用map到jsx打印对象的属性?

时间:2017-09-13 09:08:23

标签: javascript reactjs ecmascript-6

我有这组数据

const data = [{
    date: '2017-1-1',
    abc: 1,
    def: 2
},{
    date: '2017-1-2',
    abc: 3,
    def: 6
}]

如何打印

on date of 2017-1-1
abc is equal to 1 and def is equal to 2

on date of 2017-1-2
abc is equal to 3 and def is equal to 6

我坚持将abc和def属性输出到jsx。如果我做data.map(o => o.abc)我可以获得1但是如何使用map获取属性?或者我应该使用Object.keys和forEach ??

我不能硬编码abc或def coz它可能有其他新属性。

2 个答案:

答案 0 :(得分:-1)

使用模板文字。类似的东西:

data.map(o => `on date of ${o.date} abc is equal to ${o.abc} and def is equal to ${o.def}`)

答案 1 :(得分:-1)

使用forEach代替地图,因为您对获取新数组不感兴趣

尝试以下解决方案



const data = [{
    date: '2017-1-1',
    abc: 1,
    def: 2
},{
    date: '2017-1-2',
    abc: 3,
    def: 6
}];

data.forEach(function(item){
    var output = [];
    Object.keys(item).forEach(function(key) {
    if(key !== "date")
        output.push(key +" is equal to "+item[key]);
});

console.log("on date of "+item.date+" "+ output.join(" and "));
})