Bläddra i källkod

Autocomplete: add hide-loading (#11260)

杨奕 7 år sedan
förälder
incheckning
38a13de337

+ 1 - 0
examples/docs/en-US/input.md

@@ -711,6 +711,7 @@ Attribute | Description | Type | Options | Default
 | label | label text | string | — | — |
 | prefix-icon | prefix icon class | string | — | — |
 | suffix-icon | suffix icon class | string | — | — |
+| hide-loading | whether to hide the loading icon in remote search | boolean | — | false |
 
 ### Autocomplete Slots
 

+ 3 - 0
examples/docs/es/input.md

@@ -688,6 +688,9 @@ Atributo | Descripción | Tipo | Opciones | Por defecto
 | name | igual que `name` en el input nativo | string | — | — |
 | select-when-unmatched | si se emite un evento `select` al pulsar enter cuando no hay coincidencia de Autocomplete | boolean | — | false |
 | label | texto de la etiqueta | string | — | — |
+| prefix-icon | prefix icon class | string | — | — |
+| suffix-icon | suffix icon class | string | — | — |
+| hide-loading | whether to hide the loading icon in remote search | boolean | — | false |
 
 ### Autocomplete Slots
 

+ 1 - 0
examples/docs/zh-CN/input.md

@@ -863,6 +863,7 @@ export default {
 | label | 输入框关联的label文字 | string | — | — |
 | prefix-icon | 输入框头部图标 | string | — | — |
 | suffix-icon | 输入框尾部图标 | string | — | — |
+| hide-loading | 是否隐藏远程加载时的加载图标 | boolean | — | false |
 
 ### Autocomplete Slots
 | name | 说明 |

+ 4 - 6
packages/autocomplete/src/autocomplete-suggestions.vue

@@ -3,16 +3,14 @@
     <div
       v-show="showPopper"
       class="el-autocomplete-suggestion el-popper"
-      :class="{ 'is-loading': parent.loading }"
+      :class="{ 'is-loading': !parent.hideLoading && parent.loading }"
       :style="{ width: dropdownWidth }"
-      role="region"
-    >
+      role="region">
       <el-scrollbar
         tag="ul"
         wrap-class="el-autocomplete-suggestion__wrap"
-        view-class="el-autocomplete-suggestion__list"
-      >
-        <li v-if="parent.loading"><i class="el-icon-loading"></i></li>
+        view-class="el-autocomplete-suggestion__list">
+        <li v-if="!parent.hideLoading && parent.loading"><i class="el-icon-loading"></i></li>
         <slot v-else>
         </slot>
       </el-scrollbar>

+ 2 - 1
packages/autocomplete/src/autocomplete.vue

@@ -114,7 +114,8 @@
       placement: {
         type: String,
         default: 'bottom-start'
-      }
+      },
+      hideLoading: Boolean
     },
     data() {
       return {

+ 12 - 0
types/autocomplete.d.ts

@@ -56,6 +56,18 @@ export declare class ElAutocomplete extends ElementUIComponent {
   /** Whether show suggestions when input focus */
   triggerOnFocus: boolean
 
+  /** Whether to emit a `select` event on enter when there is no autocomplete match */
+  selectWhenUnmatched: boolean
+
+  /** Prefix icon class */
+  prefixIcon: string
+
+  /** Suffix icon class */
+  suffixIcon: string
+
+  /** Whether to hide the loading icon in remote search */
+  hideLoading: boolean
+
   /**
    * Focus the Input component
    */