Browse Source

fix: 优化折叠面板 change 回调方法

yumingming11 5 years ago
parent
commit
82f4df5f0a

+ 5 - 1
src/packages/collapse/collapse.vue

@@ -40,7 +40,11 @@ export default {
   },
   },
   methods: {
   methods: {
     changeEvt(name) {
     changeEvt(name) {
-      this.$parent.change(name);
+      if (this.$parent.change && typeof this.$parent.change == 'function') {
+        this.$parent.change(name);
+      } else {
+        this.$emit('change', name);
+      }
     },
     },
     changeValAry(name) {
     changeValAry(name) {
       let index = -1;
       let index = -1;

+ 2 - 2
src/packages/collapse/demo.vue

@@ -56,8 +56,8 @@ export default {
     };
     };
   },
   },
   methods: {
   methods: {
-    change(name) {
-      console.log(`点击了name是${name}的面板`);
+    callback(name) {
+      console.log(`点击了name是${name}的面板,callback`);
     }
     }
   }
   }
 };
 };

+ 9 - 2
src/packages/collapse/doc.md

@@ -12,7 +12,7 @@ CollapseItem.install(Vue);
 通过`v-model`控制展开的面板列表,`activeNames`为数组格式
 通过`v-model`控制展开的面板列表,`activeNames`为数组格式
 
 
 ```html
 ```html
-<nut-collapse v-model="activeNames">
+<nut-collapse v-model="activeNames" @change="callback">
     <nut-collapse-item title="标题1" :name="1">
     <nut-collapse-item title="标题1" :name="1">
         京东“厂直优品计划”首推“政府优品馆” 3年覆盖80%镇级政府 
         京东“厂直优品计划”首推“政府优品馆” 3年覆盖80%镇级政府 
     </nut-collapse-item>
     </nut-collapse-item>
@@ -30,6 +30,11 @@ export default {
     return {
     return {
         activeNames: [1, 2]
         activeNames: [1, 2]
     };
     };
+  },
+  methods: {
+    callback(name) {
+      console.log(`点击了name是${name}的面板,callback`);
+    }
   }
   }
 };
 };
 ```
 ```
@@ -105,7 +110,9 @@ export default {
 
 
 | 事件名 | 说明 | 回调参数 |
 | 事件名 | 说明 | 回调参数 |
 |------|------|------|
 |------|------|------|
-| change | 切换面板时触发 | 类型与 v-model 绑定的值一致 |
+| change | 切换面板时触发 | 类型与 v-model 绑定的值一致。 |
+
+> 使用 @change = "function" 回调。如果未使用,会直接触发 methods 中定义的 change 方法,如不需要回调,尽量不要在 methods 中定义 change 方法
 
 
 ### CollapseItem Props
 ### CollapseItem Props
 | 参数 | 说明 | 类型 | 默认值 | 
 | 参数 | 说明 | 类型 | 默认值 |