前端开发之Element树结构组件el-input的type=“password“时候账号密码自动填充解决方案

最新推荐文章于 2024-06-19 14:18:55 发布
最新推荐文章于 2024-06-19 14:18:55 发布
阅读量603 收藏 4
点赞数 4
分类专栏： element-plus 文章标签： vue elementui input
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/m0_50207524/article/details/137478315
版权
文章讲述了在ElementUI的el-input组件中，当type设置为password时，如何避免浏览器的自动填充导致默认值的问题。提出在input中添加autocomplete=new-password属性作为解决方案。
摘要由CSDN通过智能技术生成

Element树结构组件el-input的type=“password“时候账号密码自动填充解决方案

前言

在使用element的input的password当参数和login的参数相同时，在浏览器保存的用户名密码会自动填充，导致input附加上默认值
使用场景一般是在用户管理创建新的用户的时候会遇到

效果图

在这里插入图片描述

解决方案

在input框中加入autocomplete="new-password"来解决

<el-input v-model=xxx type="password" autocomplete="new-password" placeholder="password" />
冯浩(grow up)
关注
  • 4
    点赞
  • 踩
  • 4
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
vue使用element-ui的el-input监听不了回车事件的解决方法
08-28
小编在使用element-ui时，el-input组件监听不了回车事件，怎么回事呢？下面小编给大家带来了vue使用element-ui的el-input监听不了回车事件的解决方法，一起看看吧
vue-cli3.0+element-ui上传组件el-upload的使用
10-17
在Vue.js开发中，Element UI 是一款非常流行的前端UI库，它提供了丰富的组件，使得开发者能够快速构建美观的用户界面。在本篇文章中，我们将详细探讨如何在vue-cli3.0环境中使用Element UI的上传组件el-upload。el-...
解决 Element的el-input 密码输入框浏览器自动填充账号密码问题
潮汐未见潮落的博客
09-02 7425
解决 Element的el-input 密码输入框浏览器自动填充账号密码问题
浏览器的记住密码，autocomplete= “new-password“解决
qq_42401946的博客
01-08 3205
例：直接加autocomplete= “new-password” <a-form-model-item prop="userPassword" class="explain-long"> <a-input-password v-model="form.userPassword" autocomplete="new-password" :maxLength="20" placeholder="请输入密码" :style="styleO
【vue解决el-input组件自动填充用户名密码】
最新发布
xiejunlan的博客
06-19 360
解决el-input组件自动填充用户名密码
element-ui 去掉谷歌浏览器el-input组件或input自动填充账号密码
MISS_zhang_0110的博客
09-13 3366
1.使用element中el-input自带的属性auto-complete（版本二可用）,但是值不能按照官网而要改成new-password。2.使用el-input组件的只读属性（是否）readonly，开始要input框为只读，readonly = “true”。3.注册聚焦事件focus，控制readonly的属性值（true，false）。
阻止浏览器自动填充input密码框
liubt817的博客
09-05 3184
使用随机的字段名称：将密码输入框的 name 属性设置为一个随机的值，例如将其设置为一个长字符串或随机生成的唯一标识符。这样可以绕过浏览器的自动填充机制，因为浏览器通常是通过字段名称来判断是否自动填充密码的。此外，这些方法仅适用于阻止浏览器自动填充密码，而并非完全禁用浏览器的密码管理功能。用户仍然可以手动输入或选择保存密码。使用 autocomplete=“new-password” 属性：在密码输入框中添加 autocomplete=“new-password” 属性，这会告诉浏览器不要自动填充密码。
浏览器的记住密码，autocomplete= "new-password"解决
热门推荐
aydongzhiping的博客
08-10 2万+
在项目中有记住密码的勾选功能，要求无论是否勾选都记住帐号，在逻辑上都走通后，测试阶段出现了bug：无论是否勾选记住密码，密码都会自动填充。 经过排查，是因为浏览器的记住密码功能影响的。目前最优的解决办法是在input type="password"输入框中加上autocomplete = "new-password"属性，163邮箱也是又用到的。 在寻找解决办法的时候有了解到浏览器记住密码自动...
浏览器的记住密码，autocomplete= “new-password“
weixin_40362806的博客
11-23 640
处理密码都会自动填充
Vue-页面解决浏览器自动填充input输入框账号密码
JackieDYH的博客
12-18 1292
登录注册页面禁止浏览器自动填充账号密码。
Vue+element 解决浏览器自动填充记住的账号密码问题
12-10
我们在做form表单的时候,会发现,浏览器会自动的将我们之前保存的密码,自动的填充到表单中input 为 type="password" 的框中 登录页面也就算了,但是注册页面就很难受了,有一种不受控制的感觉 不行,我的代码必须由我...
element-ui 的el-button组件中添加自定义颜色和图标的实现方法.docx
01-13
"element-ui 的 el-button 组件中添加自定义颜色和图标的实现方法" 在 Element UI 中，el-button 组件是非常常用的一个组件，但是默认情况下，它的颜色和图标都有限制。如果我们想要添加自定义的颜色和图标，该如何...
如何使用el-input组件去除浏览器自动填充账号密码
weixin_44191318的博客
06-21 8626
如何使用el-input组件去除浏览器自动填充账号密码
终极解决版 element-ui input=password 在浏览器会自动填充密码的问题
weixin_44999420的博客
05-20 2413
写项目时发现, 在注册用户界面时, 之前浏览器记住的账号被自动填充了, 并且因为公司项目有做密码的显示隐藏功能, 然后用户就能直接看到密码了, 这肯定不行. 超级大的问题. 于是就是百度了一圈. 发现目前现在看到的解决方案有几种(下面做了归纳), 但是都无法解决我的问题: 1.设置 autocomplete属性； ```js <el-input type="password" v-model="form.checkPass" auto-complete="n...
vue 解决密码框 input 中type=“password“时，chrome浏览器会回显之前保存的用户名和密码
我心中有猛虎 细嗅蔷薇
01-15 3373
现象 input的type="password"时，会出现之前保存的用户名和密码回显出来 解决办法 给input加上如下属性 <el-input v-model=xxx type="password" autocomplete="new-password" readonly onfocus="this.removeAttribute('readonly');this.type='password'" placeholder="password" /> ...
vue3 elementPlus 解决密码框自动填充问题
HurryUpp的博客
07-31 1763
【代码】vue3 elementPlus 解决密码框自动填充问题。
elementui 里使用input 密码框,输入时禁止弹出浏览器历史密码提示框
u010328533的博客
12-25 2005
解决方案,使用css的 -webkit-text-security: disc;官方api上,使用autocomplete属性不生效。
取消浏览器自动补全文本框与密码框行为？
SM_Cute的博客
04-14 356
取消浏览器自动补全文本框与密码框行为？
el-input type="textarea"
04-06
b'el-input type="textarea"' 是一个 Vue UI 组件，它表示一个文本框，可以用于输入多行文字。在 HTML 中，其语法为：<el-input type="textarea"></el-input>。在 Vue 中，可以通过引入 Element UI 库来使用该组件。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值