难以为3个数组对象编写代码

时间:2018-08-07 12:57:10

标签: reactjs

我有3个文件,每个文件包含一个包含对象的数组,每个对象包含几个参数,如示例中所示:

player.js

const player = [
{playername:'1', teamname:['1','2',...], eventname:['1','2',...]},
{playername:'2', teamname:['1','3',...], eventname:['1','4',...]}
...
]

team.js

const team = [
{teamname:'1', playername:['1','3'...], eventname:['2','3'...], imageteam1:''},
{teamname:'3', playername:['1','4'...], eventname:['2','4'...], imageteam3:''}
...
]

event.js

const enent = [
{eventname:'1', playername:['1','3'...], teamname:['2','3'...]},
{eventname:'4', playername:['1','4'...], teamname:['2','4'...]}
...
]    

GridPlayerTeamsMembership .js

class GridPlayerTeamsMembership extends React.Component {

  render() {
    const { classes } = this.props;


return (
      <div className={classes.root}>
        <List>
          {players.playerTeams.map(value => (
            <ListItem  dense button className={classes.listItem}>
              <Avatar src='' />
              <ListItemText primary={` ${value}`} />
            </ListItem>
          ))}
        </List>
      </div>
    );
  }
}

我正在编辑问题,以明确我遇到的困难: 我的目的是从数组中的匹配对象中检索特定属性。

在上面的示例中,我获得了一个团队列表,我想要在其中检索存储在代表同一团队的对象中的图像

1 个答案:

答案 0 :(得分:0)

首先,我要为每次查找节省一些计算时间的方法是将这些数组保存到对象中。

即:

// instead of
const players = [
    {playername: 1, ....},
    {playername: 'key', ....},
];

// I'll have:
const players = {
    1: {playername: 1, ....},
    key: {playername: 'key', ....},
};

如果从某个存储中获取它,则可以轻松地通过循环将数组转换为映射对象。

const mappedPlayers = {};
players.map(player => {
    mappedPlayers[player.playerName] = player;
})

现在,您要为活动和团队这样做。

完成后,您可以按名称轻松访问特定的团队,球员或事件(我更喜欢ID,但在本示例中为名称)