【项目经验】:elementui 表单问题

一.项目问题

1.在登录页面输入密码后浏览器保存密码,在下一次别的页面打开输入框会自动输入浏览器保存的密码。原因是浏览器会默认认为当前input的属性是password。

2.当form表单只有一个表单时回车提交表单问题

二.最终解决方案

浏览器自动填充密码问题

先设置input输入框的type属性为text; 然后获取焦点时改变type为password。

复制代码
// html
<input type="password" onfocus="type='password'">
<el-input type = 'text' @focus = "focusFn"></el-input>

// js
    
focusFn(e){
   e.srcElement.type = 'password'
}

form表单只有一个表单时回车提交表单问题

表单加@submit.native.prevent

html 复制代码
<el-form @submit.native.prevent>
        <el-form-item>
            <el-input 
                v-model="form.password"
                @keyup.enter.native="enterInput"
            />
        </el-form-item>
    </el-form>
相关推荐
美酒没故事°3 小时前
vue3拖拽+粘贴的综合上传器
前端·javascript·typescript
zhengxianyi5155 小时前
只需3句让Vue3 打包部署后通过修改配置文件修改全局变量——实时生效
vue.js·前后端分离·数据大屏·ruoyi-vue-pro优化
Miketutu8 小时前
Flutter学习 - 组件通信与网络请求Dio
开发语言·前端·javascript
摘星编程8 小时前
React Native for OpenHarmony 实战:Swiper 滑动组件详解
javascript·react native·react.js
鸣弦artha8 小时前
Flutter框架跨平台鸿蒙开发——Build流程深度解析
开发语言·javascript·flutter
QQ4022054969 小时前
python基于vue的大学生课堂考勤系统设计与实现django flask pycharm
vue.js·python·django
LongJ_Sir11 小时前
Cesium--可拖拽气泡弹窗(Vue3版)
javascript
跟着珅聪学java11 小时前
JavaScript 中定义全局变量的教程
javascript
午安~婉12 小时前
整理知识点
前端·javascript·vue
向前V12 小时前
Flutter for OpenHarmony数独游戏App实战:底部导航栏
javascript·flutter·游戏