映射具有用户ID的对象数组并从该用户ID获取用户详细信息

Question

我有一个类似的对象数组

const array = [{
    text: 'some text',
    userID: '1'
  },
  {
    text: 'another text',
    userID: '2'
  }
]

我必须在React中映射此数组，还必须通过userID获取用户详细信息，例如username和user-dp。我应该怎么做。我正在使用React，MongoDB，NodeJS，Express。

我尝试在映射前端代码中的数组时调用api以获取用户详细信息。后来我得知我们不应该在render（）方法中调用api，因此它无法正确呈现。

Answer 1

您的问题还不完整，但是我会尝试一下... 假设您有：

const array = [{
    text: 'some text',
    userID: '1'
  },
  {
    text: 'another text',
    userID: '2'
  }
];

您可以

async componentDidMount() {
  // I dont know where the array come from, ill assume it comes from the props...
  const { array } = this.props;
  // Promise.all returning an array of userDetails in the same order than the given array
  const userDetails = await Promise.all(array.map(({userID}) => fetch(`apiUrl/${userID}`);
  this.setState({ userDetails })
}; 

然后，您可以通过访问自己的状态来访问渲染中的详细信息。