Browse Source

add: AvatarList

tolking 5 years ago
parent
commit
6579ab5e1c

+ 3 - 3
src/components/AvatarList/README.md → docs/AvatarList.md

@@ -13,7 +13,7 @@ Vue.use(AvatarList);
 
 - 或者局部引用
 
-``` js
+``` vue
 // XXX.vue
 import { AvatarList, AvatarListItem } from "../../components/AvatarList/index";
 
@@ -68,9 +68,9 @@ export default {
 
 | 参数 | 说明 | 类型 | 默认值 |
 | --- | --- | ---| --- |
-| size | 头像大小 | number 或者 e m (large、small 、mini, default) | default |
+| size | 头像大小 | number 或者 enum (large、small、mini、default) | default |
 | maxLength | 要显示的最大项目 | number | 0 |
-| excessItemsStyle | 多余的项目风格 | Object | null |
+| excessItemsStyle | 多余的项目风格 | Object | - |
 
 ### AvatarListItem
 

+ 2 - 2
src/components/AvatarList/index.js

@@ -5,7 +5,7 @@ const install = function(Vue) {
   Vue.component(AvatarList.name, AvatarList);
   Vue.component(AvatarListItem.name, AvatarListItem);
 };
-const Avatars = { AvatarList, AvatarListItem, install };
+const avatar = { AvatarList, AvatarListItem, install };
 
-export default Avatars;
+export default avatar;
 export { AvatarList, AvatarListItem, install };

+ 4 - 8
src/components/AvatarList/item.vue

@@ -1,6 +1,6 @@
 <template>
   <a-tooltip :title="tips">
-    <a-avatar :size="itemSize" :src="src" :style="excessItemsStyle">
+    <a-avatar :size="size" :src="src" :style="!src && excessItemsStyle">
       <slot></slot>
     </a-avatar>
   </a-tooltip>
@@ -10,10 +10,6 @@
 export default {
   name: "AvatarListItem",
   props: {
-    size: {
-      type: [String, Number],
-      default: ""
-    },
     tips: {
       type: String,
       default: ""
@@ -25,13 +21,13 @@ export default {
   },
   data() {
     return {
-      itemSize: this.size || this.$parent.size || "default",
-      excessItemsStyle: this.$parent.excessItemsStyle || null
+      size: this.$parent.size,
+      excessItemsStyle: this.$parent.excessItemsStyle
     };
   },
   watch: {
     "$parent.size"(val) {
-      this.itemSize = val;
+      this.size = val;
     },
     "$parent.excessItemsStyle"(val) {
       this.excessItemsStyle = val;

+ 1 - 1
src/components/AvatarList/list.vue

@@ -27,7 +27,7 @@ export default {
     let items;
     if (this.maxLength > 0 && this.maxLength < list.length) {
       items = list.slice(0, this.maxLength);
-      items.push(h("avatar-list-item", "+" + this.maxLength));
+      items.push(h("avatar-list-item", "+" + (list.length - this.maxLength)));
     } else {
       items = list;
     }