Browse Source

Input: update input password (#14480)

* refactor: Refactor Input component

* Update input.vue

* Update input.vue
iamkun 6 years ago
parent
commit
969fdd264b
1 changed files with 4 additions and 11 deletions
  1. 4 11
      packages/input/src/input.vue

+ 4 - 11
packages/input/src/input.vue

@@ -52,25 +52,18 @@
         class="el-input__suffix"
         class="el-input__suffix"
         v-if="$slots.suffix || suffixIcon || showClear || showPassword || validateState && needStatusIcon">
         v-if="$slots.suffix || suffixIcon || showClear || showPassword || validateState && needStatusIcon">
         <span class="el-input__suffix-inner">
         <span class="el-input__suffix-inner">
-          <template v-if="!showClear">
+          <template v-if="!showClear || !showPwdVisible">
             <slot name="suffix"></slot>
             <slot name="suffix"></slot>
             <i class="el-input__icon"
             <i class="el-input__icon"
               v-if="suffixIcon"
               v-if="suffixIcon"
               :class="suffixIcon">
               :class="suffixIcon">
             </i>
             </i>
           </template>
           </template>
-          <i v-else
+          <i v-if="showClear"
             class="el-input__icon el-icon-circle-close el-input__clear"
             class="el-input__icon el-icon-circle-close el-input__clear"
             @click="clear"
             @click="clear"
           ></i>
           ></i>
-          <template v-if="!showVisible">
-            <slot name="suffix"></slot>
-            <i class="el-input__icon"
-              v-if="suffixIcon"
-              :class="suffixIcon">
-            </i>
-          </template>
-          <i v-else
+          <i v-if="showPwdVisible"
             class="el-input__icon el-icon-view el-input__clear"
             class="el-input__icon el-icon-view el-input__clear"
             @click="handlePasswordVisible"
             @click="handlePasswordVisible"
           ></i>
           ></i>
@@ -224,7 +217,7 @@
           this.nativeInputValue &&
           this.nativeInputValue &&
           (this.focused || this.hovering);
           (this.focused || this.hovering);
       },
       },
-      showVisible() {
+      showPwdVisible() {
         return this.showPassword &&
         return this.showPassword &&
           !this.inputDisabled &&
           !this.inputDisabled &&
           !this.readonly &&
           !this.readonly &&