Vue中禁用表单的自动提交

<el-col :span="24" style="height: 36px;margin-bottom: 24px;">
      <el-form-item label="用户名" label-width="80px" prop="userName">
        <!--定义聚焦事件,避免表单的自动提交-->
         <el-input v-model="user.userName" maxLength='50' placeholder="请输入用户名" readonly="readonly" @focus="removeSelfAttr($event)"></el-input>
      </el-form-item>
</el-col>
<el-col :span="24" style="height: 36px;margin-bottom: 24px;">
       <el-form-item label="密码" label-width="80px" prop="password">
          <!--加隐藏元素,禁止表单自动填充-->
          <el-input v-model="user.password" type="password" maxLength='50' placeholder="请输入密码" readonly="readonly" @focus="removeSelfAttr($event)"></el-input>
      </el-form-item>
</el-col>

 

Vue:

removeSelfAttr(e){
    e.target.removeAttribute("readonly");
}

 

posted @ 2019-11-25 16:29  tank073  阅读(1053)  评论(0)    收藏  举报