广告
返回顶部
首页 > 资讯 > 前端开发 > JavaScript >Element中el-input密码输入框浏览器自动填充账号密码问题的解决方法
  • 477
分享到

Element中el-input密码输入框浏览器自动填充账号密码问题的解决方法

2024-04-02 19:04:59 477人浏览 薄情痞子
摘要

目录问题描述解决方法auto-complete="new-passWord"添加一个类/deep/总结问题描述 通常情况下,浏览器会默认将已保存的账号密码 填充到

问题描述

通常情况下,浏览器会默认将已保存的账号密码 填充到 input    type 值为password的输入框内,如果在登录页面,这当然是非常好的,自动填充密码可以节约时间,提高良好的使用体验,这样当然是没有什么问题的

但是如果在注册页面、新增账号等页面,这种操作 就是超出需求了(有点多此一举)

 <div class="main-side">
      <div class="login-location">
           <!-- $refs.pass.focus()  按下回车 自动聚焦 密码框  -->
            <el-input 
               @keyup.enter.native="$refs.pass.focus()" 
                v-model="account" 
                placeholder="用户名">
            </el-input>
       </div>
       <div class="login-location">
           <el-input 
               ref="pass" 
               @keyup.enter.native="userLogin()" 
               v-model="password" 
               type="password" 
               placeholder="密码">
            </el-input>
       </div>
 </div>

解决方法

auto-complete="new-password"

 在 type passworld input 中加 auto-complete="new-password" 属性即可

添加一个类

给密码框加入一个 class,之后写 CSS  

/deep/

使用了外届的组件或者自己开发一个组件,修改一处就可能会影响到用这个组件的所有样式,所以就需要有一个方法或者方式,既不影响到别的地方,又能修改子组件在当前的样式。/deep/ 就能实现,这样就不会影响项目里使用这个公共组件的其他地方的样式

.新加的类 {
  /deep/ .el-input__inner {
    -WEBkit-text-security:disc!important;
  } 
}

总结

到此这篇关于Element中el-input密码输入框浏览器自动填充账号密码问题解决的文章就介绍到这了,更多相关Element el-input密码输入框自动填充内容请搜索编程网以前的文章或继续浏览下面的相关文章希望大家以后多多支持编程网!

--结束END--

本文标题: Element中el-input密码输入框浏览器自动填充账号密码问题的解决方法

本文链接: https://www.lsjlt.com/news/167014.html(转载时请注明来源链接)

有问题或投稿请发送至: 邮箱/279061341@qq.com    QQ/279061341

本篇文章演示代码以及资料文档资料下载

下载Word文档到电脑,方便收藏和打印~

下载Word文档
猜你喜欢
软考高级职称资格查询
编程网,编程工程师的家园,是目前国内优秀的开源技术社区之一,形成了由开源软件库、代码分享、资讯、协作翻译、讨论区和博客等几大频道内容,为IT开发者提供了一个发现、使用、并交流开源技术的平台。
  • 官方手机版

  • 微信公众号

  • 商务合作