ant-design-vue/components/spin/demo/index.vue

57 lines
1.3 KiB
Vue
Raw Normal View History

2018-02-09 17:09:50 +08:00
<script>
2019-01-12 11:33:27 +08:00
import CustomIndicator from './custom-indicator';
import Basic from './basic';
import DelayAndDebounce from './delayAndDebounce';
import Inside from './inside';
import Nested from './nested';
import Size from './size';
import Tip from './tip';
import CN from '../index.zh-CN.md';
import US from '../index.en-US.md';
2018-02-09 17:09:50 +08:00
const md = {
cn: `# Spin 加载中
用于页面和区块的加载中状态
## 何时使用
页面局部处于等待异步数据或正在渲染过程时合适的加载动效会有效缓解用户的焦虑
## 代码演示`,
us: `# Spin
A spinner for displaying loading state of a page or a section.
# When To Use
2018-03-20 21:48:01 +08:00
When part of the page is waiting for asynchronous data or during a rendering process, an appropriate loading animation can effectively alleviate users' inquietude.
## Examples `,
2019-01-12 11:33:27 +08:00
};
2018-02-09 17:09:50 +08:00
export default {
2018-03-20 21:48:01 +08:00
category: 'Components',
type: 'Feedback',
title: 'Spin',
subtitle: '加载中',
2019-09-28 20:45:07 +08:00
render() {
2018-02-09 17:09:50 +08:00
return (
<div>
2019-09-28 20:45:07 +08:00
<md cn={md.cn} us={md.us} />
2018-02-09 17:09:50 +08:00
<Basic />
<Size />
<Inside />
<Nested />
<Tip />
<DelayAndDebounce />
<CustomIndicator />
<api>
2019-09-28 20:45:07 +08:00
<template slot="cn">
<CN />
2018-02-09 17:09:50 +08:00
</template>
2019-09-28 20:45:07 +08:00
<US />
2018-02-09 17:09:50 +08:00
</api>
</div>
2019-01-12 11:33:27 +08:00
);
2018-02-09 17:09:50 +08:00
},
2019-01-12 11:33:27 +08:00
};
2018-02-09 17:09:50 +08:00
</script>