修改 SearchAutoCompleteWidget 的显示/隐藏逻辑。

examples/navbar/src/NavbarExample.vue

@@ -32,12 +32,7 @@ export default {
   },
 
   methods: {
-    show: function(){
-      this.$refs.modal.showModal();
-    },
-    show1: function(){
-      this.$refs.modal1.showModal();
-    },
+    
   },
 };
 </script>

examples/page-size-select/src/PageSizeSelectExample.vue

@@ -25,12 +25,7 @@ export default {
   },
 
   methods: {
-    show: function(){
-      this.$refs.modal.showModal();
-    },
-    show1: function(){
-      this.$refs.modal1.showModal();
-    },
+   
   },
 };
 </script>

packages/info/src/InfoSearchWidget.vue

@@ -11,7 +11,7 @@
       @keyup.up="selectUp"
       @keyup.down="selectDown"
       @keyup.enter="selectEnter"
-      @keyup.esc="$refs.autoComplete.hide()"
+      @keyup.esc="autoCompleteVisible = false"
     />
     <span
       class="input-group-addon"
@@ -42,6 +42,7 @@
     </Modal>
     <SearchAutoCompleteWidget
       ref="autoComplete"
+      v-model:show="autoCompleteVisible"
       :info-window-no="infoWindowNo"
       :where-clause-source="whereClauseSource"
       class="auto-complete"
@@ -108,6 +109,7 @@ export default {
       showSubInfoWindow: false,	// 显示子查询窗口
       loading: false,
       modal: false,
+      autoCompleteVisible: false,
     };
   },
 
@@ -182,11 +184,11 @@ export default {
       var data = _self.$refs.autoComplete.getSelectData();
       if (data != undefined) {
         _self.dataSelected(data);
-        _self.$refs.autoComplete.hide();
+        _self.autoCompleteVisible = false;
       } else {
         if (_self.searchText == undefined || _self.searchText.length == 0) {
-          if (_self.$refs.autoComplete.isVisible() == true) {
-            _self.$refs.autoComplete.hide();
+          if (_self.autoCompleteVisible == true) {
+            _self.autoCompleteVisible = false;
           } else {
             _self.$refs.autoComplete.initSearch('');
           }
@@ -199,7 +201,7 @@ export default {
       var _self = this;
       this.modal=true;
 
-      _self.$refs.autoComplete.hide();
+      _self.autoCompleteVisible = false;
 
       this.$nextTick(function () {
         if (this.$refs.info) {
@@ -246,7 +248,7 @@ export default {
       var _self = this;
       this.modal=false;
 
-      _self.$refs.autoComplete.hide();
+      _self.autoCompleteVisible = false;
 
       if (modelData == undefined) {
         return;

packages/info/src/SearchAutoCompleteWidget.vue

@@ -1,6 +1,6 @@
 <template>
   <div
-    v-show="isShowAuto"
+    v-if="show"
     class="div-autoComplete"
     :style="{ left: realLeftComputed }"
   >
@@ -47,6 +47,13 @@ var Common = require('../../common/Common.js').default;
 export default {
   name: 'SearchAutoCompleteWidget',
   props: {
+    /**
+     * 是否显示自动提示列表
+     */
+    'show':{
+      type: Boolean,
+      default: false,
+    },
     'infoWindowNo':{
       type: String,
       default: null,
@@ -69,13 +76,12 @@ export default {
     },
   },
 
-  emits: ['selectData'],
+  emits: ['selectData', 'update:show'],
 
   data: function () {
     return {
       infoWindowDto: {},
       infoWindowData: {},
-      isShowAuto: false,
       selectIndex: -1,
       realLeft: {},
       isSearchWidget: true,
@@ -92,9 +98,9 @@ export default {
     infoWindowData: function (val) {
       var _self = this;
       if (val.dataList != undefined && val.dataList.length > 0) {
-        _self.isShowAuto = true;
+        _self.$emit('update:show', true);
       } else {
-        _self.isShowAuto = false;
+        _self.$emit('update:show', false);
       }
     },
 
@@ -167,24 +173,6 @@ export default {
       return null;
     },
 
-    /**
-     * 隐藏
-     * @return {[type]} [description]
-     */
-    hide: function () {
-      var _self = this;
-      _self.isShowAuto = false;
-    },
-
-
-    /**
-     * 是否可见
-     * @return {Boolean} [description]
-     */
-    isVisible: function () {
-      return this.isShowAuto;
-    },
-
     /**
      * 查询InfoWindowDto
      * @return {void} 
@@ -229,7 +217,7 @@ export default {
           _self.getInfoWindowData(text);
         }
       } else {
-        _self.isShowAuto = false;
+        _self.$emit('update:show', false);
       }
     },
 

packages/info/src/SearchWidget.vue

@@ -12,7 +12,7 @@
       @keyup.up="selectUp"
       @keyup.down="selectDown"
       @keyup.enter="selectEnter"
-      @keyup.esc="$refs.autoComplete.hide()"
+      @keyup.esc="autoCompleteVisible = false"
     />
     <div :class="[classSize != undefined ? 'input-group-btn classSize' : 'input-group-btn']">
       <button
@@ -51,6 +51,7 @@
 
     <SearchAutoCompleteWidget
       ref="autoComplete"
+      v-model:show="autoCompleteVisible"
       :info-window-no="infoWindowNo"
       :where-clause-source="whereClauseSource"
       class="auto-complete"
@@ -142,6 +143,7 @@ export default {
       leftPosition: 0,
       loading: false,
       modal: false,
+      autoCompleteVisible: false,
     };
   },
 
@@ -216,11 +218,11 @@ export default {
       var data = _self.$refs.autoComplete.getSelectData();
       if (data != undefined) {
         _self.dataSelected(data);
-        _self.$refs.autoComplete.hide();
+        _self.autoCompleteVisible = false;
       } else {
         if (_self.searchText == undefined || _self.searchText.length == 0) {
-          if (_self.$refs.autoComplete.isVisible() == true) {
-            _self.$refs.autoComplete.hide();
+          if (_self.autoCompleteVisible == true) {
+            _self.autoCompleteVisible = false;
           } else {
             _self.$refs.autoComplete.initSearch('');
           }
@@ -239,7 +241,7 @@ export default {
 
       this.modal=true;
 
-      _self.$refs.autoComplete.hide();
+      _self.autoCompleteVisible = false;
 
       if (this.$refs.info) {
         _self.$refs.info.refresh();
@@ -282,7 +284,7 @@ export default {
       var _self = this;
       this.modal=false;
 
-      _self.$refs.autoComplete.hide();
+      _self.autoCompleteVisible = false;
 
       if (modelData == undefined) {
         return;