Mapping array of questions and rating

[06amaru]

I have an array of objects and I am trying to iterate over the array however when I click a star in the rating component , it always references to the first element in the array. Why does it have this behavior?

<List disablePadding>
   {questions.map( (question ,index) => (
      <ListItem className={classes.listItem} key={index}>
        <ListItemText primary={question.description} secondary={question.answer} /> 
          <Typography component="legend">Rating</Typography>
          <Rating
                name="rating-id"
                value={question.rating}
                onChange={(event, newValue) => {
                  console.log(question); //prints the first element of the array
                }}
              />
        </ListItem>
   ))}
</List>

[support[bot]]

👋 Thanks for using Material-UI!

We use GitHub issues exclusively as a bug and feature requests tracker, however, this issue appears to be a support request.

For support, please check out https://material-ui.com/getting-started/support/. Thanks!

If you have a question on StackOverflow, you are welcome to link to it here, it might help others. If your issue is subsequently confirmed as a bug, and the report follows the issue template, it can be reopened.

[oliviertassinari]

tip: check the warnings in the console if you remove the name prop (unique).