docs(skeleton): update doc

Author: liweijie0812

src/skeleton/props.ts

@@ -2,20 +2,34 @@
 
 /**
  * 该文件为脚本自动生成文件，请勿随意修改。如需修改请联系 PMC
- * updated at 2021-12-26 15:04:09
  * */
 
 import { TdSkeletonProps } from './type';
 import { PropType } from 'vue';
 
 export default {
-  /** 动画效果，有「渐变加载动画」和「闪烁加载动画」两种。值为空则表示没有动画 */
+  /** 动画效果，有「渐变加载动画」和「闪烁加载动画」两种。值为 'none' 则表示没有动画 */
   animation: {
     type: String as PropType<TdSkeletonProps['animation']>,
+    default: 'none' as TdSkeletonProps['animation'],
     validator(val: TdSkeletonProps['animation']): boolean {
-      return ['gradient', 'flashed'].includes(val);
+      if (!val) return true;
+      return ['gradient', 'flashed', 'none'].includes(val);
     },
   },
+  /** 加载完成的内容 */
+  content: {
+    type: [String, Function] as PropType<TdSkeletonProps['content']>,
+  },
+  /** 加载完成的内容，同 content */
+  default: {
+    type: [String, Function] as PropType<TdSkeletonProps['default']>,
+  },
+  /** 延迟显示加载效果的时间，用于防止请求速度过快引起的加载闪烁，单位：毫秒 */
+  delay: {
+    type: Number,
+    default: 0,
+  },
   /** 是否为加载状态，如果是则显示骨架图，如果不是则显示加载完成的内容 */
   loading: {
     type: Boolean,
@@ -28,13 +42,10 @@ export default {
   /** 快捷定义骨架图风格，有基础、头像组合等，具体参看代码示例 */
   theme: {
     type: String as PropType<TdSkeletonProps['theme']>,
+    default: 'text' as TdSkeletonProps['theme'],
     validator(val: TdSkeletonProps['theme']): boolean {
+      if (!val) return true;
       return ['text', 'avatar', 'paragraph', 'avatar-text', 'tab', 'article'].includes(val);
     },
   },
-  /** 延迟显示加载效果的事件，用于放置请求速度过快引起的家在闪烁，单位：毫秒 */
-  delay: {
-    type: Number,
-    default: 0,
-  },
 };

src/skeleton/skeleton.en-US.md

@@ -1,12 +1,15 @@
 :: BASE_DOC ::
 
 ## API
+
 ### Skeleton Props
 
 name | type | default | description | required
 -- | -- | -- | -- | --
-animation | String | none | options：gradient/flashed/none | N
+animation | String | none | options: gradient/flashed/none | N
+content | String / Slot / Function | - | Typescript：`string \| TNode`。[see more ts definition](https://github.com/Tencent/tdesign-vue/blob/develop/src/common.ts) | N
+default | String / Slot / Function | - | Typescript：`string \| TNode`。[see more ts definition](https://github.com/Tencent/tdesign-vue/blob/develop/src/common.ts) | N
 delay | Number | 0 | \- | N
 loading | Boolean | true | \- | N
-rowCol | Array | - | Typescript：`SkeletonRowCol` `type SkeletonRowCol = Array<Number \| SkeletonRowColObj \| Array<SkeletonRowColObj>>` `interface SkeletonRowColObj { width?: string; height?: string; size?: string; marginRight?: string; marginLeft?: string; margin?: string; content?: string \| TNode; type?: 'rect' \| 'circle' \| 'text' }`。[see more ts definition](https://github.com/Tencent/tdesign-vue/blob/develop/src/common.ts)。[see more ts definition](https://github.com/Tencent/tdesign-vue/tree/develop/src/skeleton/type.ts) | N
-theme | String | text | options：text/avatar/paragraph/avatar-text/tab/article | N
+rowCol | Array | - | Typescript：`SkeletonRowCol` `type SkeletonRowCol = Array<number \| SkeletonRowColObj \| Array<SkeletonRowColObj>>` `interface SkeletonRowColObj { width?: string; height?: string; size?: string; marginRight?: string; marginLeft?: string; margin?: string; content?: string \| TNode; type?: 'rect' \| 'circle' \| 'text' }`。[see more ts definition](https://github.com/Tencent/tdesign-vue/blob/develop/src/common.ts)。[see more ts definition](https://github.com/Tencent/tdesign-vue/tree/develop/src/skeleton/type.ts) | N
+theme | String | text | options: text/avatar/paragraph/avatar-text/tab/article | N

src/skeleton/skeleton.md

@@ -1,12 +1,15 @@
 :: BASE_DOC ::
 
 ## API
+
 ### Skeleton Props
 
-名称 | 类型 | 默认值 | 说明 | 必传
+名称 | 类型 | 默认值 | 描述 | 必传
 -- | -- | -- | -- | --
 animation | String | none | 动画效果，有「渐变加载动画」和「闪烁加载动画」两种。值为 'none' 则表示没有动画。可选项：gradient/flashed/none | N
-delay | Number | 0 | 【开发中】延迟显示加载效果的时间，用于防止请求速度过快引起的加载闪烁，单位：毫秒 | N
+content | String / Slot / Function | - | 加载完成的内容。TS 类型：`string \| TNode`。[通用类型定义](https://github.com/Tencent/tdesign-vue/blob/develop/src/common.ts) | N
+default | String / Slot / Function | - | 加载完成的内容，同 content。TS 类型：`string \| TNode`。[通用类型定义](https://github.com/Tencent/tdesign-vue/blob/develop/src/common.ts) | N
+delay | Number | 0 | 延迟显示加载效果的时间，用于防止请求速度过快引起的加载闪烁，单位：毫秒 | N
 loading | Boolean | true | 是否为加载状态，如果是则显示骨架图，如果不是则显示加载完成的内容 | N
-rowCol | Array | - | 高级设置，用于自定义行列数量、宽度高度、间距等。【示例一】，`[1, 1, 2]` 表示输出三行骨架图，第一行一列，第二行一列，第三行两列。【示例二】，`[1, 1, { width: '100px' }]` 表示自定义第三行的宽度为 `100px`。【示例三】，`[1, 2, [{ width, height }, { width, height, marginLeft }]]` 表示第三行有两列，且自定义宽度、高度、尺寸（圆形或方形使用）、间距、内容等。TS 类型：`SkeletonRowCol` `type SkeletonRowCol = Array<Number \| SkeletonRowColObj \| Array<SkeletonRowColObj>>` `interface SkeletonRowColObj { width?: string; height?: string; size?: string; marginRight?: string; marginLeft?: string; margin?: string; content?: string \| TNode; type?: 'rect' \| 'circle' \| 'text' }`。[通用类型定义](https://github.com/Tencent/tdesign-vue/blob/develop/src/common.ts)。[详细类型定义](https://github.com/Tencent/tdesign-vue/tree/develop/src/skeleton/type.ts) | N
+rowCol | Array | - | 高级设置，用于自定义行列数量、宽度高度、间距等。【示例一】，`[1, 1, 2]` 表示输出三行骨架图，第一行一列，第二行一列，第三行两列。【示例二】，`[1, 1, { width: '100px' }]` 表示自定义第三行的宽度为 `100px`。【示例三】，`[1, 2, [{ width, height }, { width, height, marginLeft }]]` 表示第三行有两列，且自定义宽度、高度、尺寸（圆形或方形使用）、间距、内容等。TS 类型：`SkeletonRowCol` `type SkeletonRowCol = Array<number \| SkeletonRowColObj \| Array<SkeletonRowColObj>>` `interface SkeletonRowColObj { width?: string; height?: string; size?: string; marginRight?: string; marginLeft?: string; margin?: string; content?: string \| TNode; type?: 'rect' \| 'circle' \| 'text' }`。[通用类型定义](https://github.com/Tencent/tdesign-vue/blob/develop/src/common.ts)。[详细类型定义](https://github.com/Tencent/tdesign-vue/tree/develop/src/skeleton/type.ts) | N
 theme | String | text | 快捷定义骨架图风格，有基础、头像组合等，具体参看代码示例。可选项：text/avatar/paragraph/avatar-text/tab/article | N

src/skeleton/type.ts

@@ -2,38 +2,46 @@
 
 /**
  * 该文件为脚本自动生成文件，请勿随意修改。如需修改请联系 PMC
- * updated at 2021-12-26 15:04:09
  * */
 
 import { TNode } from '../common';
 
 export interface TdSkeletonProps {
   /**
-   * 动画效果，有「渐变加载动画」和「闪烁加载动画」两种。值为空则表示没有动画
+   * 动画效果，有「渐变加载动画」和「闪烁加载动画」两种。值为 'none' 则表示没有动画
+   * @default none
    */
-  animation?: 'gradient' | 'flashed';
+  animation?: 'gradient' | 'flashed' | 'none';
+  /**
+   * 加载完成的内容
+   */
+  content?: string | TNode;
+  /**
+   * 加载完成的内容，同 content
+   */
+  default?: string | TNode;
+  /**
+   * 延迟显示加载效果的时间，用于防止请求速度过快引起的加载闪烁，单位：毫秒
+   * @default 0
+   */
+  delay?: number;
   /**
    * 是否为加载状态，如果是则显示骨架图，如果不是则显示加载完成的内容
+   * @default true
    */
   loading?: boolean;
   /**
    * 高级设置，用于自定义行列数量、宽度高度、间距等。【示例一】，`[1, 1, 2]` 表示输出三行骨架图，第一行一列，第二行一列，第三行两列。【示例二】，`[1, 1, { width: '100px' }]` 表示自定义第三行的宽度为 `100px`。【示例三】，`[1, 2, [{ width, height }, { width, height, marginLeft }]]` 表示第三行有两列，且自定义宽度、高度、尺寸（圆形或方形使用）、间距、内容等
-   * @default [1, 1, 1, { width: '70%' }]
    */
   rowCol?: SkeletonRowCol;
   /**
    * 快捷定义骨架图风格，有基础、头像组合等，具体参看代码示例
    * @default text
    */
   theme?: 'text' | 'avatar' | 'paragraph' | 'avatar-text' | 'tab' | 'article';
-  /**
-   * 延迟显示加载效果的事件，用于放置请求速度过快引起的家在闪烁，单位：毫秒
-   * @default 0
-   */
-  delay?: number;
 }
 
-export type SkeletonRowCol = Array<Number | SkeletonRowColObj | Array<SkeletonRowColObj>>;
+export type SkeletonRowCol = Array<number | SkeletonRowColObj | Array<SkeletonRowColObj>>;
 
 export interface SkeletonRowColObj {
   width?: string;