You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 

31 lines
891 B

import { Button, Skeleton, Space } from 'antd';
import React, { useState } from 'react';
const App: React.FC = () => {
const [loading, setLoading] = useState<boolean>(false);
const showSkeleton = () => {
setLoading(true);
setTimeout(() => {
setLoading(false);
}, 3000);
};
return (
<Space direction="vertical" style={{ width: '100%' }} size={16}>
<Skeleton loading={loading}>
<h4 style={{ marginBottom: 16 }}>Ant Design, a design language</h4>
<p>
We supply a series of design principles, practical patterns and high quality design
resources (Sketch and Axure), to help people create their product prototypes beautifully
and efficiently.
</p>
</Skeleton>
<Button onClick={showSkeleton} disabled={loading}>
Show Skeleton
</Button>
</Space>
);
};
export default App;