输入密码禁止显示浏览器记住的密码

src/pages/counter/list/index.vue

@@ -137,21 +137,21 @@
             <!-- 动画开始 -->
             <div v-if="popText==='密码器'"   style="width:800px;padding-right:150px;padding-top:80px">
                 <el-form :model="passwordForm" :rules="passwordRules" ref="form" label-width="180px" key="passwordFormpasswordAgain">
-                    
                     <!-- <form style="display:none">
                         <input type="password">
                     </form>
                     <input type="password" style="width:0;height:0;float:left;visibility:hidden"> -->
-
+                    <el-form-item class="password-wrap" label="密码" prop="passwordAgain">
-                    <el-form-item label="密码" prop="passwordAgain">
+                        <el-input :class="{'password-input': !viewPassword1}" v-focus v-model="passwordForm.passwordAgain" maxlength="6" onkeyup="{this.value=this.value.replace(/\D/g,'')}" autocomplete="new-password" auto-complete="new-password"></el-input>
-                        <el-input v-focus show-password v-model="passwordForm.passwordAgain" maxlength="6" onkeyup="{this.value=this.value.replace(/\D/g,'')}" autocomplete="off" auto-complete="off"></el-input>
+                        <i class="view el-icon-view" @click="viewPassword1 = !viewPassword1"></i>
                     </el-form-item>
                     <!-- <el-form-item label="确认密码" prop="password" v-if="systemId == '62,1' || systemId == '62,2' || systemId == '62,3'">
                         <el-input show-password v-model="passwordForm.password"  maxlength="6" onkeyup="this.value=this.value.replace(/\D/g,'')" autocomplete="off"></el-input>
                     </el-form-item> -->
                     <!-- <el-form-item label="确认密码" prop="password2" v-if="systemId == '62,1' || systemId == '62,2' || systemId == '62,3'"> -->
-                    <el-form-item label="确认密码" prop="password2" key="passwordFormpassword2" v-if="id == '62,1' || id == '62,2' || id == '62,3'">
+                    <el-form-item class="password-wrap" label="确认密码" prop="password2" key="passwordFormpassword2" v-if="id == '62,1' || id == '62,2' || id == '62,3'">
-                        <el-input show-password v-model="passwordForm.password2"  maxlength="6" onkeyup="this.value=this.value.replace(/\D/g,'')" autocomplete="off" auto-complete="off"></el-input>
+                        <el-input :class="{'password-input': !viewPassword2}" v-model="passwordForm.password2"  maxlength="6" onkeyup="this.value=this.value.replace(/\D/g,'')" autocomplete="off" auto-complete="off"></el-input>
+                        <i class="view el-icon-view" @click="viewPassword2 = !viewPassword2"></i>
                     </el-form-item>
                     
                 </el-form>
@@ -430,6 +430,8 @@ export default {
             }
         };
         return {
+            viewPassword1: false,
+            viewPassword2: false,
             voucherCardGet: false,
             voucherCardNumber: 0,
             
@@ -2213,6 +2215,18 @@ export default {
 </script>
 
 <style lang="scss" scoped>
+.password-wrap {
+  position: relative;
+  .password-input {
+    font-family: 'password';
+  }
+  .view {
+    position: absolute;
+    top: 13px;
+    right: 12px;
+    cursor: pointer;
+  }
+}
 .contentHeight {
     max-width: 300px;
     max-height: 60px;

src/styles/common.scss

@@ -5,6 +5,10 @@
     src: url('font/YouSheBiaoTiHei.ttf');
 }
 
+@font-face{
+  font-family: 'password';
+  src: url('font/password.ttf');
+}
 [v-cloak] {
     display: none;
 }