ant-design/components/spin/demo/fullscreen.tsx

33 lines
670 B
TypeScript
Raw Normal View History

import React from 'react';
import { Button, Spin } from 'antd';
const App: React.FC = () => {
const [spinning, setSpinning] = React.useState(false);
const [percent, setPercent] = React.useState(0);
const showLoader = () => {
setSpinning(true);
let ptg = -10;
const interval = setInterval(() => {
ptg += 5;
setPercent(ptg);
if (ptg > 120) {
clearInterval(interval);
setSpinning(false);
setPercent(0);
}
}, 100);
};
return (
<>
<Button onClick={showLoader}>Show fullscreen</Button>
<Spin spinning={spinning} percent={percent} fullscreen />
</>
);
};
export default App;