perf(card): 扩展 插槽 用法, 新增 title 属性

docs/docs/zh-CN/components/avatar.md

@@ -1,7 +1,7 @@
 ::: demo
 
 <template>
-  <lay-avatar :src="avatar"></lay-avatar>
+  <lay-avatar :href="href"></lay-avatar>
 </template>
 
 <script>
@@ -10,10 +10,10 @@ import { ref } from 'vue'
 export default {
   setup() {
 
-    const avatar = "https://portrait.gitee.com/uploads/avatars/user/2813/8441097_shaynas_1610801433.png"
+    const href = ref("https://portrait.gitee.com/uploads/avatars/user/2813/8441097_shaynas_1610801433.png")
 
     return {
-        avatar
+        href
     }
   }
 }
@@ -24,7 +24,7 @@ export default {
 ::: demo
 
 <template>
-  <lay-avatar :src="avatar" radius></lay-avatar>
+  <lay-avatar :href="avatar" radius></lay-avatar>
 </template>
 
 <script>
@@ -48,10 +48,10 @@ export default {
 ::: demo
 
 <template>
-  <lay-avatar :src="avatar" size="xs"></lay-avatar> 
-  <lay-avatar :src="avatar" size="sm"></lay-avatar>
-  <lay-avatar :src="avatar"></lay-avatar>
-  <lay-avatar :src="avatar" size="lg"></lay-avatar>
+  <lay-avatar :href="avatar" size="xs"></lay-avatar> 
+  <lay-avatar :href="avatar" size="sm"></lay-avatar>
+  <lay-avatar :href="avatar"></lay-avatar>
+  <lay-avatar :href="avatar" size="lg"></lay-avatar>
 </template>
 
 <script>

docs/docs/zh-CN/components/cards.md

@@ -1,6 +1,37 @@
 ::: demo
 
 <template>
+<div class="card-container">
+  <lay-card title="标题">
+      内容
+  </lay-card>
+</div>
+</template>
+
+<script>
+import { ref } from 'vue'
+
+export default {
+  setup() {
+
+    return {
+    }
+  }
+}
+</script>
+
+<style>
+.card-container {
+  background: whitesmoke;
+  padding: 20px;
+}
+</style>
+:::
+
+::: demo
+
+<template>
+<div class="card-container">
   <lay-card>
       <template v-slot:header>
       标题
@@ -9,6 +40,7 @@
       内容
       </template>
   </lay-card>
+</div>
 </template>
 
 <script>
@@ -23,16 +55,22 @@ export default {
 }
 </script>
 
+<style>
+.card-container {
+  background: whitesmoke;
+  padding: 20px;
+}
+</style>
 :::
 
 ::: demo
 
 <template>
+<div class="card-container">
   <lay-card>
-      <template v-slot:body>
       内容
-      </template>
   </lay-card>
+</div>
 </template>
 
 <script>
@@ -47,11 +85,24 @@ export default {
 }
 </script>
 
+<style>
+.card-container {
+  background: whitesmoke;
+  padding: 20px;
+}
+</style>
 :::
 
+
 <lay-field title="Card attributes" style="margin-top:40px"/>
 
 |        |      |        |
 | ------ | ---- | ------ |
-| header | 插槽 | `内容` |
-| body   | 插槽 | `内容` |
+| title | 标题 | -- |
+
+<lay-field title="Card slots" style="margin-top:40px"/>
+
+|        |      |        |
+| ------ | ---- | ------ |
+| header | 头部插槽 | -- |
+| body   | 内容插槽 | -- |

docs/docs/zh-CN/components/page.md

@@ -113,9 +113,14 @@ export default {
 | ----------- | ------------ | ------- |
 | limit       | 每页数量     | --      |
 | total       | 总条数       | --      |
-| jump        | 切换回调     | --      |
 | showCount   | 显示总数     | `false` |
 | showPage    | 显示每页     | `false` |
 | showLimit   | 显示每页数量 | `false` |
 | showRefresh | 显示刷新按钮 | `false` |
 | showSkip    | 显示跳转     | `false` |
+
+<lay-field title="Page events" style="margin-top:40px"/>
+
+|             |              |         |
+| ----------- | ------------ | ------- |
+| jump       | 切换回调     | --      |