Вот так вот сделал, и все заработало. А финальную мысль

нашел в книжке таки!

export default class App extends Component {
constructor(props) {
super(props);

this.state = {
randomUsersList: [],
loading: false
};
}

componentDidMount() {
this.setState({loading: true})
fetch('https://api.randomuser.me/?results=20')
.then(response => response.json())
.then( usersList => usersList.results )
.then( userNames => userNames.map( user => user.name) )
.then( namesList => namesList.map(name => name.first +' ' + name.last) )
.then( preparedNamesList => this.setState(
{randomUsersList: preparedNamesList , loading: false}) )
}

render() {
const { randomUsersList, loading } = this.state

console.log(randomUsersList)

return(
<div className="columns-center">
<LeftColumn/>
<div className="content">
<h1> Случайные пользователи </h1>
<div>
{ loading ? <p>Wait five seconds.....</p> :
!randomUsersList.length ? <p>No users.....</p> :
randomUsersList.map(userName => <p>{userName}</p>)
}
</div>
</div>
<RightColumn/>
</div>
);
}
}

3 ответов

17 просмотров

уфф

нужно, чтобы код был понятным

Ярослав- Автор вопроса

Похожие вопросы

Обсуждают сегодня

Hi! Could you please upvote my new notebook? thanks a lot. https://www.kaggle.com/code/melissamonfared/anime-character-generation-dsgan-gan
məru
4
upvote plz https://www.kaggle.com/code/bassetkerouche/swapping-face?scriptVersionId=207300096
benkerrouche Statoinary
1
-- Привет всем. -- Есть csv, проблема в том что он содержит очень много повторов по столбцам и по строкам. -- Решил перекинуть это в базу данных, чтобы было проще. Но я не ша...
Oleg Ivanov
1
Как считаете - вопрос на собесе: «Как быстрее всего запустить ec2 машину в aws (в чистом аккаунте) и показать вывод от любой команды с нее» не очень ли сложный для условного м...
Sergey
50
Господа, у меня вопрос. Что вообще такое этот ваш data science и data scientists? А то гуглю, а мне какую-то расплывчатую фигню говорят.
Inkosta
44
Hi could you please help me with my two new projects? https://www.kaggle.com/code/hesankazemnia/rice-image-classification-cnn-pytorch https://www.kaggle.com/code/hesankazemnia...
Hesan
6
Исходя из ваших комментариев, получается, что чтобы получить марты в CH из данных в PG, неправильно тянуть сырые данные в CH и там их обрабатывать, лепить справочники и джойни...
unhingedlunatic
42
hi, Can you upvote? https://www.kaggle.com/code/durjoychandrapaul/rag-q-a-system-by-langchain-huggingface-for-pdf?scriptVersionId=204704280
A
1
Could you upvote and comment please? https://www.kaggle.com/code/tatianapetrushkevich/beginner-images https://www.kaggle.com/code/tatianapetrushkevich/python-for-beginners1 ...
Tazziyana
7
Коллеги, приветствую! Появилась не совсем тривиальная задача реализовать в nginx редирект HTTPS —> HTTP. Да, именно так, а не наоборот. Мы разрабатываем embedded устройство,...
Никита
24
Карта сайта