docs: optimize features of guide/image/link and so on

examples/sites/demos/pc/app/guide/webdoc/guide.js

@@ -117,5 +117,113 @@ export default {
       },
       codeFiles: ['callback.vue']
     }
+  ],
+  features: [
+    {
+      id: 'basic',
+      name: '基础用法',
+      support: {
+        value: true
+      },
+      description: '通过 dom-data 设置每一个步骤要显示的内容，show-step 设置为 true 即可开启指引。',
+      cloud: {
+        value: true
+      },
+      apis: ['dom-data', 'show-step'],
+      demos: ['basic-usage']
+    },
+    {
+      id: 'arrow-position',
+      name: '箭头位置',
+      support: {
+        value: true
+      },
+      description:
+        '通过 pop-position 属性设置箭头位置，若存在多个步骤，可以在 dom-data 里面添加 popPosition 属性并赋值。',
+      cloud: {
+        value: true
+      },
+      apis: ['pop-position'],
+      demos: ['arrow-position']
+    },
+    {
+      id: 'content',
+      name: '内容展示',
+      support: {
+        value: true
+      },
+      description: '支持纯段落用户引导、图文结合用户引导等多种内容展示方式。',
+      cloud: {
+        value: true
+      },
+      apis: ['only-content', 'text'],
+      demos: ['only-content', 'image-text']
+    },
+    {
+      id: 'highlight',
+      name: '高亮配置',
+      support: {
+        value: true
+      },
+      description: '通过 hightBox 属性添加需要高亮的元素，支持多处高亮。',
+      cloud: {
+        value: true
+      },
+      apis: ['hightBox'],
+      demos: ['highlight-box']
+    },
+    {
+      id: 'offset',
+      name: '偏移配置',
+      support: {
+        value: true
+      },
+      description: '通过 main-axis、cross-axis、alignment-axis 设置纵轴、横轴和对齐轴的偏移量。',
+      cloud: {
+        value: true
+      },
+      apis: ['main-axis', 'cross-axis', 'alignment-axis'],
+      demos: ['offset']
+    },
+    {
+      id: 'size',
+      name: '尺寸配置',
+      support: {
+        value: true
+      },
+      description: '通过 width 和 height 来自定义宽高。',
+      cloud: {
+        value: true
+      },
+      apis: ['width', 'height'],
+      demos: ['size']
+    },
+    {
+      id: 'modal',
+      name: '模态层配置',
+      support: {
+        value: true
+      },
+      description:
+        '通过 modal-overlay-opening-padding 和 modal-overlay-opening-radius 配置模态叠加层开口的填充量和边界半径。',
+      cloud: {
+        value: true
+      },
+      apis: ['modal-overlay-opening-padding', 'modal-overlay-opening-radius'],
+      demos: ['modal-overlay-opening']
+    },
+    {
+      id: 'events',
+      name: '事件回调',
+      support: {
+        value: true
+      },
+      description: '支持在 dom-data 中配置各种事件回调。',
+      cloud: {
+        value: true
+      },
+      apis: ['events'],
+      demos: ['callback']
+    }
   ]
 }

examples/sites/demos/pc/app/icon/webdoc/icon.js

@@ -62,5 +62,85 @@ export default {
       },
       codeFiles: ['list.vue']
     }
+  ],
+  features: [
+    {
+      id: 'basic',
+      name: '基本用法',
+      support: {
+        value: true
+      },
+      description: '通过 name 设置图标名称，size 设置图标大小。',
+      cloud: {
+        value: true
+      },
+      apis: ['name', 'size'],
+      demos: ['basic-usage']
+    },
+    {
+      id: 'color',
+      name: '颜色配置',
+      support: {
+        value: true
+      },
+      description: '通过 color 设置图标颜色。',
+      cloud: {
+        value: true
+      },
+      apis: ['color'],
+      demos: ['custom-color']
+    },
+    {
+      id: 'animation',
+      name: '动画效果',
+      support: {
+        value: true
+      },
+      description: '通过 animation 设置图标动画效果，可选值：spin、pulse、bounce。',
+      cloud: {
+        value: true
+      },
+      apis: ['animation'],
+      demos: ['animation']
+    },
+    {
+      id: 'rotation',
+      name: '旋转',
+      support: {
+        value: true
+      },
+      description: '通过 rotation 设置图标旋转角度。',
+      cloud: {
+        value: true
+      },
+      apis: ['rotation'],
+      demos: ['rotation']
+    },
+    {
+      id: 'flip',
+      name: '翻转',
+      support: {
+        value: true
+      },
+      description: '通过 flip 设置图标翻转方向，可选值：horizontal、vertical。',
+      cloud: {
+        value: true
+      },
+      apis: ['flip'],
+      demos: ['flip']
+    },
+    {
+      id: 'events',
+      name: '事件',
+      support: {
+        value: true
+      },
+      description: '支持 click 事件。',
+      cloud: {
+        value: true
+      },
+      apis: ['click'],
+      demos: ['events']
+    }
   ]
 }

examples/sites/demos/pc/app/image/webdoc/image.js

@@ -160,5 +160,98 @@ export default {
       },
       codeFiles: ['events.vue']
     }
+  ],
+  features: [
+    {
+      id: 'basic',
+      name: '基本用法',
+      support: {
+        value: true
+      },
+      description: '通过 src 设置图片路径，通过 fit 属性确定图片如何适应到容器框。',
+      cloud: {
+        value: false
+      },
+      apis: ['src', 'fit'],
+      demos: ['basic-usage']
+    },
+    {
+      id: 'placeholder',
+      name: '占位内容',
+      support: {
+        value: true
+      },
+      description: '通过 slot = placeholder 自定义占位内容。',
+      cloud: {
+        value: false
+      },
+      apis: ['placeholder-slot'],
+      demos: ['custom-placeholder']
+    },
+    {
+      id: 'lazy',
+      name: '懒加载',
+      support: {
+        value: true
+      },
+      description: '通过 lazy 开启懒加载功能，当图片滚动到可视范围内才会加载。',
+      cloud: {
+        value: false
+      },
+      apis: ['lazy', 'scroll-container'],
+      demos: ['lazy']
+    },
+    {
+      id: 'preview',
+      name: '预览功能',
+      support: {
+        value: true
+      },
+      description: '通过 preview-src-list 属性，传入一组图片 url 的数组，点击图片后进入预览大图模式。',
+      cloud: {
+        value: false
+      },
+      apis: ['preview-src-list', 'z-index', 'show-index'],
+      demos: ['preview']
+    },
+    {
+      id: 'style',
+      name: '样式保持',
+      support: {
+        value: true
+      },
+      description: '通过 keep-style 属性可以让图片切换时样式保持一致。',
+      cloud: {
+        value: false
+      },
+      apis: ['keep-style'],
+      demos: ['keep-style']
+    },
+    {
+      id: 'events',
+      name: '事件处理',
+      support: {
+        value: true
+      },
+      description: '支持 change-index、load、error 等事件。',
+      cloud: {
+        value: false
+      },
+      apis: ['change-index', 'load', 'error'],
+      demos: ['index-change', 'events']
+    },
+    {
+      id: 'slots',
+      name: '插槽',
+      support: {
+        value: true
+      },
+      description: '支持 placeholder、error、count 等插槽。',
+      cloud: {
+        value: false
+      },
+      apis: ['placeholder-slot', 'error-slot', 'count-slot'],
+      demos: ['slot', 'count-slot']
+    }
   ]
 }

examples/sites/demos/pc/app/infinite-scroll/webdoc/infinite-scroll.js

@@ -31,5 +31,33 @@ export default {
       },
       codeFiles: ['disabled.vue']
     }
+  ],
+  features: [
+    {
+      id: 'basic',
+      name: '基本用法',
+      support: {
+        value: true
+      },
+      description: '在列表上添加指令 v-infinite-scroll 并指定加载方法，实现滚动加载。',
+      cloud: {
+        value: false
+      },
+      apis: ['v-infinite-scroll'],
+      demos: ['basic-usage']
+    },
+    {
+      id: 'disabled',
+      name: '禁用加载',
+      support: {
+        value: true
+      },
+      description: '通过 infinite-scroll-disabled 属性控制是否禁用加载。',
+      cloud: {
+        value: false
+      },
+      apis: ['infinite-scroll-disabled'],
+      demos: ['disabled']
+    }
   ]
 }