element-ui 去掉谷歌浏览器el-input组件自动填充账号密码

1.使用element中el-input自带的属性auto-complete（版本二可用）,但是值不能按照官网而要改成new-password。

2.使用el-input组件的只读属性（是否）readonly，开始要input框为只读，readonly = “true”。

3.注册聚焦事件focus，控制readonly的属性值（true，false）。

效果图

一、主要代码之el-input

<el-form-item label="密码:"><el-inputv-model="item.password"size="small"show-passwordauto-complete="new-password":readonly="readonlyFlag"@focus="handlerIpClick"></el-input></el-form-item>readonlyFlag: true,handlerIpClick() {this.readonlyFlag = false},

二、主要代码之input

问题：如题，在谷歌浏览器中，有时input标签会自动填充数据，如用户名密码等。。。

解决：给input标签加上autocomplete属性，

如果是type=“text”就加上autocomplete="off"属性，

如果type=“password”，就加上autocomplete="new-password"属性(见下图)

<input:type="showType"v-model="item.password":autocomplete="showFlag ? 'off' : 'new-password'"/><div @click="showPassword"><svg-icon v-if="showFlag" iconClass="password-open"></svg-icon><svg-icon v-else iconClass="password-close"></svg-icon></div>showFlag: false,showType: 'password',showPassword() {this.showFlag = !this.showFlagthis.showType = this.showFlag ? 'text' : 'password'},

链接: /weixin_44191318/article/details/125386427

链接: /hi1234560/article/details/118487828

如果觉得《element-ui 去掉谷歌浏览器el-input组件或input自动填充账号密码》对你有帮助，请点赞、收藏，并留下你的观点哦！