使用者登入時,使用者往往會選擇記住密碼，由於瀏覽器自身的問題，當表單中輸入框型別為password時，該輸入框會有歷史記錄。效果如下：

原先的程式碼：

<el-row v-if="dialogStatus==='update'?false:true" type="flex" class="row-bg">
  <el-col :span="12">
    <el-form-item label="賬戶密碼:" prop="password">
      <el-input v-model="edit.password" type="password" clearable prop="password"/>
    </el-form-item>
  </el-col>
</el-row>
<el-row type="flex" class="row-bg">
  <el-col :span="12">
    <el-form-item v-if="dialogStatus==='update'?false:true" label="確認密碼:" prop="checkPassword">
      <el-input v-model="edit.checkPassword" type="password" clearable prop="registeredAddress"/>
    </el-form-item>
  </el-col>
</el-row>

修改後的程式碼：

<el-row v-if="dialogStatus==='update'?false:true" type="flex" class="row-bg">
  <el-col :span="12">
    <el-form-item label="賬戶密碼:" prop="password">
      <el-input id="pwd" type="password" readonly="true" style="display:none"/>
      <el-input id="hidePwd" v-model="edit.password" type="text"
 
 clearable/>
    </el-form-item>
  </el-col>
</el-row>
<el-row type="flex" class="row-bg">
  <el-col :span="12">
    <el-form-item v-if="dialogStatus==='update'?false:true" label="確認密碼:" prop="checkPassword">
      <el-input id="pwd" type="password" readonly="true" style="display:none"/>
 

      <el-input id="hidePwd" v-model="edit.checkPassword" type="text" clearable prop="registeredAddress"/>

    </el-form-item>
  </el-col>
</el-row>

還需要結合js來處理：即隱藏type為text的輸入框，顯示type為password的輸入框並獲取焦點

openCreateDialog() {
  // 瀏覽器記住密碼會影響表單
  $('#hidePwd').on('focus', function() {
    // 當前文字框隱藏
    $(this).hide()
    // 隱藏的密碼框顯示並且獲取焦點 只讀屬性去掉
    $('#pwd').show().attr('readonly', false).focus()
  })
  this.userEnterpriseId = this.enterpriseId
  // console.log(this.userEnterpriseId)
  this.resetTemp()
  this.roleShow()
  this.dialogFormVisible = true
  this.disabled = false
  this.dialogStatus = 'create'
  const userType = this.edit.userType
  this.$nextTick(() => {
    this.$refs['from'].clearValidate()
    this.userTypeChange(userType)
  })
},