fix(Select): add change event

heyui · Dec 3, 2018 · 48f092f · 48f092f
1 parent 0745ac7
commit 48f092f
Show file tree

Hide file tree

Showing 4 changed files with 45 additions and 2 deletions.
diff --git a/doc/components/component/data/plugin/select.vue b/doc/components/component/data/plugin/select.vue
@@ -182,6 +182,26 @@
         <td>全局config <code>dict.titleName</code></td>
       </tr>
     </table>
+
+
+    <h3>Select 事件</h3>
+    <table class="table">
+      <tr>
+        <th>事件</th>
+        <th>说明</th>
+        <th>返回数据</th>
+      </tr>
+      <tr>
+        <td>change</td>
+        <td>当数据产生变动的时候触发</td>
+        <td>完整对象</td>
+      </tr>
+      <tr>
+        <td>input</td>
+        <td>当数据产生变动的时候触发</td>
+        <td>当前绑定的v-model值</td>
+      </tr>
+    </table>
   </div>
 </template>
 

diff --git a/doc/components/demos/dataplugins/select1.vue b/doc/components/demos/dataplugins/select1.vue
@@ -4,7 +4,7 @@
       <button class="h-btn h-btn-s" @click="update">修改值</button>
     </p>
     <div v-width="300">
-      <Select v-model="select" :datas="param" placeholder="自定义placeholder" null-option-text="自定义请选择项"></Select>
+      <Select v-model="select" :datas="param" placeholder="自定义placeholder" null-option-text="自定义请选择项" @change="change"></Select>
     </div>
     <br/>
     <p>选中值：{{select2}}<i class="h-split"></i>
@@ -51,6 +51,9 @@ export default {
     },
     update3() {
       this.select3 = 'a2';
+    },
+    change(data) {
+      log('changeData:', data)
     }
   }
 }

diff --git a/doc/components_en/component/data/plugin/select.vue b/doc/components_en/component/data/plugin/select.vue
@@ -181,6 +181,25 @@
         <td>config <code>dict.titleName</code></td>
       </tr>
     </table>
+
+    <h3>Select Event</h3>
+    <table class="table">
+      <tr>
+        <th>Event</th>
+        <th>Description</th>
+        <th>Return value</th>
+      </tr>
+      <tr>
+        <td>change</td>
+        <td>When data changed</td>
+        <td>total object value</td>
+      </tr>
+      <tr>
+        <td>input</td>
+        <td>When data changed</td>
+        <td>v-model value</td>
+      </tr>
+    </table>
   </div>
 </template>
 

diff --git a/src/components/select/select.vue b/src/components/select/select.vue
@@ -304,13 +304,14 @@ export default {
       this.setObjects();
       let value = this.type == 'key' ? this.codes : this.objects;
       this.$emit('input', value);
+      this.$emit('change', this.objects);
       let event = document.createEvent("CustomEvent");
       event.initCustomEvent("setvalue", true, true, this.objects);
       this.$el.dispatchEvent(event);
       this.nowSelected = -1;
       if (this.multiple) {
         this.searchInput = '';
-        this.$nextTick(()=>{
+        this.$nextTick(() => {
           this.dropdown.update();
         })
       } else {