Что не так со свойством задержки в react-loadable?

Я использую загружаемую с реакцией библиотеку для отложенной загрузки в reactJS. Он очень хорошо работает для компонента рендеринга. Но когда я использую свойство задержки, время рендеринга не изменяется. Итак, что мне здесь нужно обновить?

const Home = Loadable({
  loader: () => import('./Home'),
  loading: Loading,
  delay: 5000
});

const Test = Loadable({
  loader: () => import('./Test'),
  loading: Loading,
  delay: 5000
});

return (
  <Router>
    <div className = "App">
      <Link to = "/"> Home </Link>
      <Link to = "/test"> Test </Link>
      <Route exact path = "/" component = {Home} />
      <Route path='/test' component = {Test} />
    </div>
  </Router>
);

Спасибо за любую помощь.

Где определена ваша функция Loading? Я этого не вижу.

mattdevio 15.09.2018 07:27

@mattdevio Я тоже определил это в этом файле. я скучаю, чтобы показать это. Это здесь: функция Загрузка ({pastDelay}) {console.info (pastDelay); вернуть прошлую задержку? <h3> Загрузка ... </h3>: null; }

stevenH 15.09.2018 08:29
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.
Концепция локализации и ее применение в приложениях React ⚡️
Концепция локализации и ее применение в приложениях React ⚡️
Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...
Навигация по приложениям React: Исчерпывающее руководство по React Router
Навигация по приложениям React: Исчерпывающее руководство по React Router
React Router стала незаменимой библиотекой для создания одностраничных приложений с навигацией в React. В этой статье блога мы подробно рассмотрим...
Массив зависимостей в React
Массив зависимостей в React
Все о массиве Dependency и его связи с useEffect.
1
2
778
1

Ответы 1

Задержка не влияет на время рендеринга фактического компонента, но задерживает время рендеринга компонента Loading.

Вот выдержка из официальной документации:

Avoiding Flash Of Loading Component

Sometimes components load really quickly (<200ms) and the loading screen only quickly flashes on the screen. A number of user studies have proven that this causes users to perceive things taking longer than they really have. If you don't show anything, users perceive it as being faster. So your loading component will also get a pastDelay prop which will only be true once the component has taken longer to load than a set delay.

Источник: https://github.com/jamiebuilds/react-loadable#avoiding-flash-of-loading-component

Прежде всего, хочу сказать спасибо за ваш ответ. Эту тему следует закрыть. Я решил эту проблему.

stevenH 09.06.2019 18:43

Другие вопросы по теме