Блог

Главная - Вопросы по программированию - Сопоставление массива объектов, имеющих идентификатор пользователя, и получение сведений о пользователе из этого идентификатора пользователя

Сопоставление массива объектов, имеющих идентификатор пользователя, и получение сведений о пользователе из этого идентификатора пользователя

#javascript #node.js #reactjs #mapping

#javascript #node.js #reactjs #отображение

Вопрос:

У меня есть массив объектов, таких как

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

Я должен сопоставить этот массив в React, а также получить данные пользователя, такие как username и user-dp, через идентификатор пользователя. Как я должен это сделать? Я использую React, MongoDB, NodeJS, Express.

Я попытался вызвать api для получения сведений о пользователе при отображении массива в моем интерфейсном коде. Он не отображается должным образом, поскольку позже я узнал, что мы не должны вызывать api в методе render().

Комментарии:

1. Сопоставить с каким форматом? Что вы пробовали?

2. Где данные пользователя? пользователь dp? Можете ли вы предоставить нам фактический массив?

3. сведения о пользователе: имя пользователя и URL-адрес для фотографии пользователя

4. отображение массива для отображения его во внешнем интерфейсе. Заголовок и сведения о пользователе.

5. Кто-нибудь может мне помочь с этим?

Ответ №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 })
};

И тогда у вас будет доступ к вашим данным в рендеринге, получив доступ к вашему состоянию.

Метки: