doc(website): Update Readme.md

Author: cuilanxin

packages/core/src/ActionSheet/README.md

@@ -3,6 +3,8 @@ ActionSheet 动作面板
 
 该组件提供了一种动作面板, 底部缓缓出现
 
+<image src='https://user-images.githubusercontent.com/57083007/137631382-70df5dd3-0200-4ddb-bd11-3578ee99d032.gif' alt='ActionSheet' style='zoom:33%;' />
+
 ### 基础示例
 
 ```jsx

packages/core/src/Avatar/README.md

@@ -3,6 +3,7 @@ Avatar 头像
 
 用来代表用户或事物，支持图片展示，当前是基于 React Native 组件 Image 封装，你也可以使用更快的图片展示插件 [react-native-fast-image](https://github.com/DylanVann/react-native-fast-image)。
 
+<image src='https://user-images.githubusercontent.com/57083007/137631738-4338453c-c552-4caa-9261-8fd84c018942.png' alt='Avatar' style='zoom:33%;' />
 
 ### 基础示例
 

packages/core/src/Badge/README.md

@@ -1,6 +1,8 @@
 Badge 标记
 ---
 
+<image src='https://user-images.githubusercontent.com/57083007/137631808-f3899eb4-69c1-4dd5-a686-0f8bb38fe4b6.png' alt='Badge' style='zoom:33%;' />
+
 ### 基础示例
 
 ```jsx

packages/core/src/Button/README.md

@@ -3,6 +3,9 @@ Button 按钮
 
 按钮用于开始一个即时操作。
 
+<image src='https://user-images.githubusercontent.com/57083007/137631908-57393986-82b8-4e2e-b753-aa77dac58672.png' alt='Button' style='zoom:33%;' />
+<image src='https://user-images.githubusercontent.com/57083007/137631915-8281cbac-ba0d-4795-8f8b-8274bcecc172.png' alt='Button' style='zoom:33%;' />
+
 ### 基础示例
 
 <!--DemoStart--> 

packages/core/src/ButtonGroup/README.md

@@ -3,6 +3,8 @@ ButtonGroup 按钮组
 
 用于一组按钮的排版展示。
 
+<image src='https://user-images.githubusercontent.com/57083007/137632086-8441bd1b-e8f9-4c15-828d-ad86310fdb72.png' alt='ButtonGroup' style='zoom:33%;' />
+
 ### 基础示例
 
 <!--DemoStart--> 

packages/core/src/Card/README.md

@@ -3,6 +3,8 @@ Card 卡片
 
 最基础的卡片容器，可承载文字、列表、图片、段落。
 
+<image src='https://user-images.githubusercontent.com/57083007/137632175-fc80bff2-7224-4843-97ec-9f8d9cbc6746.png' alt='Card' style='zoom:33%;' />
+
 ### 基础示例
 
 <!--DemoStart--> 

website/src/pages/components/actionSheet/index.gif

@@ -6,12 +6,6 @@ export default class Page extends Markdown {
     const md = await import('@uiw/react-native/lib/ActionSheet/README.md');
     // 支持 markdown 中，相对于当前 index.tsx 相对路径引入图片资源
     importAll((require as any).context('./', true, /\.(png|gif|jpg|svg)$/), this.imageFiles);
-    const result = md.default || md;
-    const index = result.indexOf('### 基础示例');
-    const abc =
-      result.substr(0, index) +
-      "\n<image src='./index.gif' alt='ActionSheet' style='zoom:33%;' />\n\n" +
-      result.substr(index);
-    return abc;
+    return md.default || md;
   };
 }

website/src/pages/components/actionSheet/index.tsx

@@ -6,12 +6,6 @@ export default class Page extends Markdown {
     const md = await import('@uiw/react-native/lib/Avatar/README.md');
     // 支持 markdown 中，相对于当前 index.tsx 相对路径引入图片资源
     importAll((require as any).context('./', true, /\.(png|gif|jpg|svg)$/), this.imageFiles);
-    const result = md.default || md;
-    const index = result.indexOf('### 基础示例');
-    const abc =
-      result.substr(0, index) +
-      "\n<image src='./index.png' alt='Avatar' style='zoom:33%;' />\n\n" +
-      result.substr(index);
-    return abc;
+    return md.default || md;
   };
 }

website/src/pages/components/avatar/index.png

@@ -6,12 +6,6 @@ export default class Page extends Markdown {
     const md = await import('@uiw/react-native/lib/Badge/README.md');
     // 支持 markdown 中，相对于当前 index.tsx 相对路径引入图片资源
     importAll((require as any).context('./', true, /\.(png|gif|jpg|svg)$/), this.imageFiles);
-    const result = md.default || md;
-    const index = result.indexOf('### 基础示例');
-    const abc =
-      result.substr(0, index) +
-      "\n<image src='./index.png' alt='Badge' style='zoom:33%;' />\n\n" +
-      result.substr(index);
-    return abc;
+    return md.default || md;
   };
 }

website/src/pages/components/avatar/index.tsx

@@ -6,12 +6,6 @@ export default class Page extends Markdown {
     const md = await import('@uiw/react-native/lib/Button/README.md');
     // 支持 markdown 中，相对于当前 index.tsx 相对路径引入图片资源
     importAll((require as any).context('./', true, /\.(png|gif|jpg|svg)$/), this.imageFiles);
-    const result = md.default || md;
-    const index = result.indexOf('### 基础示例');
-    const abc =
-      result.substr(0, index) +
-      "\n<image src='./index.png' alt='Button' style='zoom:33%;' /><image src='./index2.png' alt='Button' style='zoom:33%;' /> \n\n" +
-      result.substr(index);
-    return abc;
+    return md.default || md;
   };
 }

website/src/pages/components/badge/index.png

@@ -6,12 +6,6 @@ export default class Page extends Markdown {
     const md = await import('@uiw/react-native/lib/ButtonGroup/README.md');
     // 支持 markdown 中，相对于当前 index.tsx 相对路径引入图片资源
     importAll((require as any).context('./', true, /\.(png|gif|jpg|svg)$/), this.imageFiles);
-    const result = md.default || md;
-    const index = result.indexOf('### 基础示例');
-    const abc =
-      result.substr(0, index) +
-      "\n<image src='./index.png' alt='ButtonGroup' style='zoom:33%;' />\n\n" +
-      result.substr(index);
-    return abc;
+    return md.default || md;
   };
 }

website/src/pages/components/badge/index.tsx

@@ -6,10 +6,6 @@ export default class Page extends Markdown {
     const md = await import('@uiw/react-native/lib/Card/README.md');
     // 支持 markdown 中，相对于当前 index.tsx 相对路径引入图片资源
     importAll((require as any).context('./', true, /\.(png|gif|jpg|svg)$/), this.imageFiles);
-    const result = md.default || md;
-    const index = result.indexOf('### 基础示例');
-    const abc =
-      result.substr(0, index) + "\n<image src='./index.png' alt='Card' style='zoom:33%;' />\n\n" + result.substr(index);
-    return abc;
+    return md.default || md;
   };
 }