задержка рендеринга до завершения выборки

#reactjs

#reactjs

Вопрос:

Я использую контекст react и useReducer для извлечения данных. Я сейчас работаю с интерфейсом. у меня есть некоторые проблемы.

это состояние

   const initialState = {
users: [
  {
    name: "Kyaw Zin Thih",
    type: "Private University",
    subjects: ["IT", "Business"],
    phNumbers: ["111-111-111", "222-222-222"],
    about: "llorem",
    location: "loremlorem",
  },
  
],
currentProfile: {},
currentPosts: [],
  

};

Внутри users будет много пользовательских данных из базы данных. внутри currentProfile будут только те данные, которые просматривает пользователь. то же самое для currentPosts . когда пользователь покинет страницу профиля, оба состояния снова будут пустыми

Мой пользовательский интерфейс такой. На главной странице будут контейнеры, которые отображают некоторые данные от «пользователей». если кто-то нажмет на контейнер, маршрутизатор приведет к странице профиля. когда кто-то достигнет страницы профиля, я буду использовать useEffect для загрузки данных в часть «currentProfile»

 useEffect(() => {
setcurrent(username);
return () => {
  deletecurrent();
};}, []);
const publicdata = useContext(PulicDataContext):
let { url } = useRouteMatch();


const { username } = useParams();
const {
setcurrent,
currentProfile,
currentPost,
deletecurrent,
loading,} = publicdata;

const { name, type, subjects, phNumbers, location, about } = currentProfile;
  

Проблема в том, что при загрузке страницы профиля текущий профиль заполняется до тех пор, пока он не будет загружен в useEffect. Таким образом, имена, типы и так далее, они также доступны при загрузке компонента. Поэтому react будет показывать пробелы только в части «return».
как я могу это исправить.

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

1. Почему бы вам не показать какой-нибудь анимирующий загрузчик вместо пустой страницы?