eye

src/components/IconSelect/index.vue

@@ -65,4 +65,5 @@ export default {
       }
     }
   }
+
 </style>

src/views/login.vue

@@ -19,14 +19,16 @@
           auto-complete="off"
           placeholder="密码"
           @keyup.enter.native="handleLogin"
-          style="position:relative !important;width:100%;background:red;display:block"
-
         >
+
+        <template #prefix>
           <svg-icon slot="prefix" icon-class="password" class="el-input__icon input-icon" />
-          <svg-icon slot="prefix" icon-class="eye"  class="el-input__icon input-icon"  style="position:absolute;right:10px"  @click="eyeTab" v-show="passwordtxt =='password'" />
-          <svg-icon slot="prefix" icon-class="eye-open"  class="el-input__icon input-icon"  style="position:absolute;right:10px"  @click="eyeTab" v-show="passwordtxt =='text'" />
+          </template>
         </el-input>
-
+        <div class="eyeWrap">
+          <svg-icon slot="prefix" icon-class="eye"  class="el-input__icon input-icon eye"   style="file:currentColor" @click="eyeTab" v-show="passwordtxt =='password'" />
+          <svg-icon slot="prefix" icon-class="eye-open"  class="el-input__icon input-icon eye"   style="file:currentColor"  @click="eyeTab" v-show="passwordtxt =='text'" />
+        </div>
       </el-form-item>
       <el-form-item prop="code" v-if="captchaOnOff">
         <el-input
@@ -274,6 +276,7 @@ export default {
   background: #ffffff;
   width: 456px;
   padding: 48px;
+  position: relative;
   .el-input {
     height: 40px;
     font-size: 16px !important;
@@ -322,7 +325,16 @@ export default {
   height:36px !important;
   line-height: 36px !important;
 }
+.eyeWrap{
+  position: relative;
 
+}
+.eye{
+  position: absolute;
+  right:10px;
+  top:-40px;
+  fill: #ccc;
+}
 </style>
 
 <style>