在 React 中使用百分比加载条

Question

我需要组合一个加载屏幕，让动画在页面加载时循环播放是没有问题的，但我想添加页面加载百分比的视觉效果，并将百分比作为道具传递控制 svg 动画。

我发现的大多数插件/模块都不够用。

Answer 1

你可以试试react-loadable。

这是一个文档：https://github.com/jamiebuilds/react-loadable。

好吧，我使用react-spinners插件加载动画：https://www.davidhu.io/react-spinners/

import Loadable from 'react-loadable'
import ClipLoader from "react-spinners/ClipLoader"

const HotelDetail = Loadable({ 
  loader: () => import('path/to/ComponentPage'),
  loading: ClipLoader 
})