fix: 修复Select组件change事件返回值

刘汉宸
1 parent e6018051
Showing 2 changed files with 16 additions and 7 deletions Show diff stats
examples/views/docs/component/select.md
packages/select/index.vue
@@ -207,7 +207,7 @@ export default {
 <template>
   <div>
     <pre class="demo-model" v-if="model">{{ model }}</pre>
-    <z-select v-model="model" url="/user/select" :http="$http"></z-select>
+    <z-select v-model="model" url="/user/commonSelect" value-key="id" :http="$http" @change="onChange"></z-select>
   </div>
 </template>
@@ -218,6 +218,11 @@ export default {
       model: '',
     }
   },
+  methods: {
+    onChange(value, item) {
+      console.log(value, item);
+    }
+  }
 }
 </script>
 ```
@@ -133,21 +133,25 @@ export default {
     remote() {
       return Boolean(this.queryApi || (this.url && (this.http || this.zHttp)));
     },
+    // Hack绑定事件，即令el-select组件绑定事件与当前z-select组件相同，且扩展部分事件返回值
     bindEvents() {
       let _events = {};
       Object.keys(this.$listeners || {}).forEach(key => {
         // 非绑定对象的情况下，通过change事件向上emit出当前选中项
         if (key === 'change' && !this.raw) {
+          // 给el-select绑定change事件，且emit到z-select的change事件并拓展
           _events[key] = value => {
             this.$emit(
               key,
               value,
-              this.optionsCurrent.reduce((result, item) => {
-                if (value.includes(item[this.valueKey])) {
-                  result.push(item);
-                }
-                return result;
-              }, []),
+              this.multiple
+                ? this.optionsCurrent.reduce((result, item) => {
+                    if (value.includes(item[this.valueKey])) {
+                      result.push(item);
+                    }
+                    return result;
+                  }, [])
+                : this.optionsCurrent.find(item => item[this.valueKey] === value),
             );
           };
         } else {