[React] Avoid Too Many Spinners with React SuspenseList’s tail Prop

tail is a customization prop for SuspenseList. It works in tandem with revealOrder and has three options: undefined, collapsed, and hidden.

These options can be used to configure how fallbacks are displayed.

  • undefined: show all fallbacks
  • hidden: show no fallbacks
  • collapsed: show only the next fallback

 

Example:

<React.SuspenseList revealOrder="forwards" tail="collapsed">
  <React.Suspense fallback={<div>Fetching Pokemon...</div>}>
    <ErrorBoundary fallback={"Couldn't catch 'em all."}>

 

posted @ 2020-04-24 03:14  Zhentiw  阅读(130)  评论(0)  编辑  收藏  举报