0


Element UI 密码输入框--可切换显示隐藏,自定义图标

在这里插入图片描述
在这里插入图片描述

<el-form-itemprop="password"><[email protected]="login"placeholder="密码"v-model="formData.password":type="showPassword ? 'text' : 'password'"><islot="suffix"@click="switchPassword"><imgv-if="showPassword"class="input_icon"src="@/assets/icons/password_show.png"/><imgv-elseclass="input_icon"src="@/assets/icons/password_hide.png"/></i></el-input></el-form-item>
.input_icon{cursor: pointer;width: 24px;padding-top: 8px;padding-right: 6px;}

data 中

// 是否显示密码showPassword:false,

methods 中

switchPassword(){this.showPassword =!this.showPassword;}

图片素材
在这里插入图片描述
在这里插入图片描述


本文转载自: https://blog.csdn.net/weixin_41192489/article/details/133940676
版权归原作者 朝阳39 所有, 如有侵权,请联系我们删除。

“Element UI 密码输入框--可切换显示隐藏,自定义图标”的评论:

还没有评论