Использование каждого элемента из выборки API отдельно
Я получаю данные из API с помощью response, и мне нужно иметь возможность использовать каждый элемент отдельно от массива. Скажем, у меня в файле JSON 16 элементов, и я хотел бы знать, как лучше отфильтровать их, потому что мое текущее решение кажется глупым.
componentDidMount() {
fetch(teamAPI)
.then((teamResponse) => teamResponse.json())
.then((teamfindresponse) => {
console.info(teamfindresponse[1]);
this.setState({
team1:teamfindresponse[0],
team2:teamfindresponse[1],
...,
team16:teamfindresponse[15],
})
})
}
Внутри рендера я делаю:
{
this.state.team1.map((dynamicData, key) =>
{dynamicData.name}
)}
Я понимаю, что отображение становится довольно бесполезным, поскольку есть только один элемент, но я не знаю других способов сделать это.
Заранее спасибо!
Вы можете дать более подробное описание? Например, какой json идет и как вы хотите это отдельно, и как @Quentin сказал, почему вам нужен массив?
JSON содержит данные с названием каждой команды, страной и контактным лицом. Моя конечная цель - получить из них список матчей. Например, я хотел бы показать название команды 4 и название команды 14, но мой метод фильтрации определенных элементов кажется плохим. Я, наверное, упускаю здесь что-то очень легкое.
Итак, вам нужен json, например {"team1": {"country": "xyz", "contact": 123}, "team2": {"country": " xyz", "contact": 123}}?
Ваша проблема - дублирование в team1:teamfindresponse[0], team2:teamfindresponse[1], ...?
В значительной степени да. Если бы я только что выполнил команду team: teamfindresponse, могу ли я отфильтровать n-й элемент внутри рендеринга или мне нужно отфильтровать их в функции ComponentDidMount, как я это сделал сейчас? Например, я считываю данные из API в команду: teamfindresponse. Теперь, когда я отображаю данные с помощью {dynamicData.name [0]}, я получаю первую букву имени, но как я могу получить полное имя n-го элемента? Извините, что я так плохо это объясняю: /
Боюсь, я не понимаю в этом смысла. Вы можете упростить это дублирование с помощью чего-то вроде this.setState(teamfindresponse.reduce((teams, team, idx) => Object.assign(teams, {['team' + (idx + 1)]: team}), {})), но я не думаю, что это решает вашу основную проблему. Хотя, возможно, я ошибаюсь.
Что ж, я предлагаю вам сопоставить ответ в соответствии с потребностями, чтобы отфильтровать его или легко получить к нему доступ. Если у вас есть время, дайте ответ, чтобы мы могли дать лучшее предложение. И, конечно же, имя [0] даст вам первую букву, попробуйте только имя.
![Безумие обратных вызовов в javascript [JS]](https://i.imgur.com/WsjO6zJb.png)
Ваш вопрос очень непонятный. Я не могу сказать, какой конечный результат вам нужен, или почему вы думаете, что представление данных в объекте, а не в виде массива, может помочь.