Question

这是我的对象，我想在我的组件中映射这个但是我有问题，我不能在这个对象上使用map。第一个值是投票，下一个是用户数组。我如何在巴贝尔上使用这个地图？

  var ObjVote = {
        '1':['EwaK','Jacek','Jacek'],
        '2':['Anna','Pawel','EwaK'],
        '3':['Anna','EwaK','Jacek'],
        '4':['Jas','Jas','Pawel'],
        '5':['Anna','Jas','Pawel']
        }

Answer 1

您可以使用：

Object.keys(ObjVote)
         .map(vote => ({ vote: vote, voters: ObjVote[vote]}))
         .map(data => <Vote {...data} key={data.vote} />)

或

Object.keys(ObjVote)
         .map(vote => ({ vote: vote, voters: ObjVote[vote]}))
         .map(data => <Vote data={data} key={data.vote} />)

现在在Vote组件中，您可以按props.data.votes和props.data.voters选民阵列访问投票。

Answer 2

您可以使用Array#from将其转换为数组，然后您可以映射它。首先，您需要通过添加length属性将对象转换为像object这样的数组。要添加长度属性，您可以使用Object#assign和Object#keys：

const ObjVote = {
  '1':['EwaK','Jacek','Jacek'],
  '2':['Anna','Pawel','EwaK'],
  '3':['Anna','EwaK','Jacek'],
  '4':['Jas','Jas','Pawel'],
  '5':['Anna','Jas','Pawel']
}

const array = Array.from(
  Object.assign( 
    {}, 
    ObjVote, 
    { length: Object.keys(ObjVote).length + 1 } // add the number of keys + 1 (the missing 0 index) as the length property 
  ),
  (voters, vote) => ({ vote, voters }) // create the vote object
).slice(1); // remove the 1st empty element

console.log(array);

Answer 3

您无法在Object上使用地图。但您可以使用Object.keys()然后使用map。

 let ObjVote = {
  '1':['EwaK','Jacek','Jacek'],
  '2':['Anna','Pawel','EwaK'],
  '3':['Anna','EwaK','Jacek'],
  '4':['Jas','Jas','Pawel'],
  '5':['Anna','Jas','Pawel']
}

let data = Object.keys(ObjVote).map(key => {
  return {
    vote: key,
    users: ObjVote[key]
  }
})

console.log(data)

然后在对象然后数组上反映映射

3 个答案: