Browse Source

fix: 文档修改&v-model优化

yumingming11 5 years ago
parent
commit
3793cf8e18
2 changed files with 14 additions and 9 deletions
  1. 9 4
      src/packages/collapse/collapse.vue
  2. 5 5
      src/packages/collapse/doc.md

+ 9 - 4
src/packages/collapse/collapse.vue

@@ -12,7 +12,7 @@ export default {
   },
   model: {
     prop: 'value',
-    event: 'changeActive'
+    event: 'change-active'
   },
   props: {
     value: {
@@ -47,13 +47,18 @@ export default {
       this.$parent.change(name);
     },
     changeValAry(name) {
-      let index = this.value.indexOf(name);
+      let index = -1;
+      this.value.forEach((item, idx) => {
+        if (String(item) == String(name)) {
+          index = idx;
+        }
+      });
       let v = JSON.parse(JSON.stringify(this.value));
       index > -1 ? v.splice(index, 1) : v.push(name);
-      this.$emit('changeActive', v);
+      this.$emit('change-active', v);
     },
     changeVal(val) {
-      this.$emit('changeActive', val);
+      this.$emit('change-active', val);
     },
     // 手风琴模式将所有的item收起,然后对应的展开(默认)
     // 对于展开的再次点击的将其设置成收起,动画效果在item组件中执行

+ 5 - 5
src/packages/collapse/doc.md

@@ -37,7 +37,7 @@ export default {
     <nut-collapse-item :title="title1" :name="1">
         华为终端操作系统EMUI 11发布,9月11日正式开启 
     </nut-collapse-item>
-    <nut-collapse-item :title="title2" :name="2" :subTitle="subTitle">
+    <nut-collapse-item :title="title2" :name="2" :sub-title="subTitle">
         中国服务机器人市场已占全球市场超1/4 
     </nut-collapse-item>
     <nut-collapse-item :title="title3" :name="3">
@@ -60,10 +60,10 @@ export default {
 
 ### 图标展示
 
-通过`expandIconPosition`可以设置图标的位置,
+通过`expandIconPosition`可以设置图标的位置,icon设置自定义图标,rotate设置图标旋转的角度
 
 ```html
-<nut-collapse v-model="activeName" :accordion="true" :expandIconPosition="expandIconPosition" :icon="icon" :rotate="rotate">
+<nut-collapse v-model="activeName" :accordion="true" :expand-icon-position="expandIconPosition" :icon="icon" :rotate="rotate">
     <nut-collapse-item :title="title1" :name="1">
         京东数科IPO将引入“绿鞋机制” 
     </nut-collapse-item>
@@ -105,7 +105,7 @@ export default {
 |------|------|------|------|
 | title | 标题栏左侧内容 | string | - |
 | name | 唯一标识符,必填 | string \ number | -1 |
-| expandIconPosition | 标题图标的位置 | string | right |
-| subTitle | 标题栏副标题 | string | - |
+| expand-icon-position | 标题图标的位置 | string | right |
+| sub-title | 标题栏副标题 | string | - |
 | icon | 标题栏自定义图标链接 | string | - |
 | rotate | 点击折叠和展开的旋转角度,在自定义图标模式下生效 | string \ number | 180 |