element-plus 使用密码输入框的自定义图标

news/2024/4/25 20:20:35

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

				<el-inputv-model="ruleFormPassword.newPassword"placeholder="请输入新密码":type="showPassword ? 'text' : 'password'":style="{ width: '360px' }"><template #suffix><span class="input_icon" @click="switchPassword">//icon图标<ScIcon v-if="showPassword" style="font-size: 16px" name="icon-mimaxianshi" /><ScIcon v-else style="font-size: 16px" name="icon-mimayincang" /></span></template></el-input>const showPassword = ref('text');// 点击切换密码显示状态
const switchPassword = () => {showPassword.value = !showPassword.value;
};.input_icon {cursor: pointer;width: 25px;height: 15px;padding-right: 6px;padding-bottom: 10px;
}

https://www.xjx100.cn/news/3119054.html

相关文章

ios(swiftui) 属性包装器详解

目录 1. State 2. Binding 3. ObservedObject 和Published 4. StateObject 5. EnvironmentObject和Environment 6. AppStorage 在 SwiftUI 中&#xff0c;属性包装器用于增强和管理视图的状态&#xff0c;以及处理视图与数据模型之间的绑定和交互。下面是一些常见…

python通过ssh密钥等形式链接到redis服务器

当使用 RSA 私钥进行 SSH 认证时&#xff0c;你可以通过 paramiko 的 RSAKey 来加载私钥&#xff0c;并用其创建 SSH 隧道。以下是修改后的代码示例&#xff0c;使用 RSA 私钥进行 SSH 连接&#xff1a; 示例代码 import paramiko from paramiko import RSAKey from sshtunne…

Fortinet 发布《2024 年网络威胁趋势预测报告》 攻击精准性、复杂性将显著提升

近日&#xff0c;全球网络安全领导者Fortinet&#xff08;Nasdaq&#xff1a;FTNT&#xff09;发布《2024 年网络威胁趋势预测报告》。该报告由Fortinet全球威胁情报和研究团队&#xff08;FortiGuard Labs&#xff09;制作&#xff0c;深入探讨了高级持续性网络犯罪的新时代&a…

Android Audio实战——音频属性设置(二十一)

在 Android 中,使用音频属性(AudioAttributes)可以控制音频的行为。AudioAttributes 已经定义了一些常见的属性,比如音频用途、音频内容类型、音频标志等。 一、音频属性简介 1、常见属性 音量(volume):使用 setParameters("volume=5") 将音量设置为 5(范围…

CSS核心功能手册:从熟悉到精通

CSS核心功能代码 文章目录 CSS核心功能代码[toc]参考HTML代码尺寸操作设置元素尺寸内边距外边距设置默认布局边距用途和使用场景&#xff1a; 背景设置**背景颜色 (background-color)**:**背景图像 (background-image)**:**背景重复 (background-repeat)**:**背景位置 (backgro…

Structured Streaming: Apache Spark的流处理引擎

欢迎来到我们的技术博客&#xff01;今天&#xff0c;我们要探讨的主题是Apache Spark的一个核心组件——Structured Streaming。作为一个可扩展且容错的流处理引擎&#xff0c;Structured Streaming使得处理实时数据流变得更加高效和简便。 什么是Structured Streaming&#…

Apache Flink(二):数据架构演变

&#x1f3e1; 个人主页&#xff1a;IT贫道_大数据OLAP体系技术栈,Apache Doris,Clickhouse 技术-CSDN博客 &#x1f6a9; 私聊博主&#xff1a;加入大数据技术讨论群聊&#xff0c;获取更多大数据资料。 &#x1f514; 博主个人B栈地址&#xff1a;豹哥教你大数据的个人空间-豹…

MySQL主从复制架构

MySQL主从复制架构 一、MySQL集群概述 ##1、集群的主要类型 高可用集群&#xff08;High Available Cluster&#xff0c;HA Cluster&#xff09; 高可用集群是指通过特殊的软件把独立的服务器连接起来&#xff0c;组成一个能够提供故障切换&#xff08;Fail Over&#xff09…