Bogopodoben
@Bogopodoben

Как сделать рендер компонента после получения данных с Api?

Необходимый стек: react, redux, react-router 3, redux-saga.
Суть вопроса такова, есть некий интерфейс для авторизованного пользователя.

Связь с api осуществляется через токен, который храниться в local storage. При инициализации приложения, чекается токен, и если он имеется, выставляться чек в store редакса, что пользователь авторизован и срабатывает сага по загрузке данных пользователя, но в момент, когда сервер собирает данные для клиента, у пользователя крутиться прелоадер, и появляются не очень красивые сайд эффекты из-за которых и хотелось бы закрыть рендер компонентов страницы, до того пока сервер не вернул данные на клиент.

Так вот, каким образом, либо как правильно построить логику, чтобы рендер компонентов страницы, либо всего приложения осуществлялся после получения данных и убрать неприятные моменты по типу, запустилось приложение, пользователь увидел кнопку "Войти", через 1-2с она изменилась на аву с никнеймом.
  • Вопрос задан
  • 982 просмотра
Пригласить эксперта
Ответы на вопрос 1
RomReed
@RomReed
JavaScript, Flutter, ReactNative, Redux, Firebase
Ну логика должна быть простая когда пользователь жмёт кнопку авторизации показывайте прелодер. Этот прелодер должен крутиться до тех пор пока не придут данные. Когда данные приходят вы должна его остановить для этого лучше иметь в редуксе какой нибудь флать типа loading. При нажатии авторизации данный флаг устанавливается в true. И как только данные пришли устанавливаете флаг в false. А в компоненте повесить проверку если true то показывать прелоадер а если false то показывать результат авторизиции (имя пользователя аву и тд) и прятать прелоадер.
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы