elementPlus 图标不显示 属性模式不显示

news2025/1/14 20:34:02

问题:

elementPlus 属性模式图标不显示

 <el-input placeholder="请输入用户名" :suffix-icon="Avatar">  //这个图标不显示

之前在main.ts里全局引入了icons-vue。这里的script里也没引入。

解决:

在当前的script中重新引入avatar就可以显示了。

<script setup>
import {Avatar} from "@element-plus/icons-vue";  //这里再引入才能用 属性模式
</script>

总结:

可能在属性模式下,图标(Avatar)是一个变量。不引入的话就无法识别吧。

如果全局引入所有图标的话,还是用插槽模式吧。

//全局引入elementIcons使用插槽模式,无需单独引入图标
<template #prefix>
    <el-icon><Lock /></el-icon>  
</template>

备注:

Input 输入框 | Element Plus

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1817045.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

MS721仪表总线(M-Bus)从站收发电路

MS721 是为 M-Bus 标准 (EN1434-3) 的应用而开发的单片收发 电路。 MS721 接口电路可以适应从站与主站之间的电压差&#xff0c;总 线的连接没有极性要求&#xff0c;电路由主站通过总线供电&#xff0c;这样从站 电池就不会增加额外的负载&#xff0c;同时还集成电源失效功…

Webshell-jsp 冰蝎流量

考点:冰蝎jsp流量解密crc碰撞png暴力爆破宽高 主要是和 main.jsp进行通信浅浅看一下 yjg.txt内容 用jsp写的一些脚本 过滤http流量 可以判断是 冰蝎 的jsp webshell 尝试爆破常用密钥 无果 那么 密钥一定在流量中 看冰蝎动态生成密钥的最后一个返回包 就是明文的key 尝试多试…

Mac外接显示器显示不全

Mac外接显示器最大化无法占满屏幕 当你遇到底部无法占满的时候&#xff0c; 只需要&#xff0c;在-->系统设置 中修改“桌面与程序坞”-->“置于屏幕上的位置”&#xff0c;改完之后&#xff0c;改回原设置就行了&#xff1b;

vue2+echarts实现简易的2d地图效果

背景 公司的一个可视化数据大屏里面&#xff0c;有一个使用echarts实现的2d地图。不是我开发的&#xff0c;在此记录一下实现过程以及一些扩展解构。应该是从哪个航空航线图改动了一下&#xff0c;效果看起来还是可以的。 效果预览 版本 vue版本使用的是"^2.6.12"…

基于springboot高校就业招聘系统的设计

管理员账户功能包括&#xff1a;系统首页&#xff0c;个人中心&#xff0c;就业咨询管理&#xff0c;毕业去向管理&#xff0c;简历管理&#xff0c;管理员管理&#xff0c;基础数据管理 辅导员账户功能包括&#xff1a;系统首页&#xff0c;个人中心&#xff0c;就业咨询管理…

函数递归(C语言)(详细过程!)

函数递归 一. 递归是什么1.1 递归的思想1.2 递归的限制条件 二. 递归举例2.1 求n的阶乘2.2 按顺序打印一个整数的每一位 三. 递归与迭代3.1 求第n个斐波那契数 一. 递归是什么 递归是学习C语言很重要的一个知识&#xff0c;递归就是函数自己调用自己&#xff0c;是一种解决问题…

【消息中间件】Pulsar 基本知识

文章目录 Pulsar一、主要特性二、应用场景三、架构设计四、Topic分区Topic&#xff08;Topic-Partition&#xff09;非持久Topic重试Topic死信Topic 五、通用的消费模型队列模型流模型Pulsar既支持队列模型&#xff0c;也支持流模型 六、订阅模式独占模式&#xff08;流模型&am…

作业8:信息存储的层次与并行技术

作业8&#xff1a;信息存储的层次与并行技术 一. 单选题&#xff08;共7题&#xff0c;70分&#xff09; (单选题) 考虑为以下表达式生成代码 A&#xff1d;B&#xff0b;C &#xff1b; D&#xff1d;E&#xff0d;F &#xff1b; 在执行过程中不需要插入任何停顿周期就能够消…

Hive函数学习之UDTF与UDAF的应用案例

UDTF与UDAF的应用案例&#xff1a; UDTF&#xff1a;一进多出 UDTF是一对多的输入输出,实现UDTF需要完成下面步骤 M1001#xiaohu#S324231212,lkd#M1002#S2543412432,S21312312412#M1003#bfy 1001 xiaohu 324231212 1002 lkd 2543412432 1003 bfy 21312312412 继承org.apache.ha…

partially initialized module ‘charset_normalizer‘ has no attribute ‘md__mypyc‘

django项目运行报错&#xff1a; partially initialized module ‘charset_normalizer‘ has no attribute ‘md__mypyc‘…… 解决办法 pip install --force-reinstall charset-normalizer3.1.0

R3CTF 2024 取证部分

TPA 02 - &#x1f4f1; Peggy 是一家公司的员工&#xff0c;和许多人一样&#xff0c;她偶尔也会使用个人手机执行与工作相关的任务。不幸的是&#xff0c;她成为了网络钓鱼攻击的目标。你的任务是找出攻击者的电话号码和佩吉的密码&#xff0c;从而揭露这次攻击的细节。 以…

为什么电容两端电压不能突变

我们先从RC延时电路说起吧&#xff0c;图1是最简单的RC延时电路&#xff0c;给一个阶跃的电压信号&#xff0c;电压会变成黄色曲线这个样子&#xff0c;这是为什么呢&#xff1f; 图1 电压跳变后&#xff0c;电源负极电子移动到电容下极板&#xff0c;排斥上极板电子流动到电源…

Vue集成SpreadJS实现Excel(高级详解)

文章目录 SpreadJS介绍安装 SpreadJS具体使用设置值和公式设置样式绑定数据 更多相关内容可查看 SpreadJS介绍 附官网地址&#xff1a;https://www.grapecity.com.cn/developer/spreadjs 附在线编辑地址&#xff1a;https://demo.grapecity.com.cn/SpreadJS/WebDesigner/inde…

大模型:分本分割模型

目录 一、文本分割 二、BERT文本分割模型 三、部署模型 3.1 下载模型 3.2 安装依赖 3.3 部署模型 3.4 运行服务 四、测试模型 一、文本分割 文本分割是自然语言处理中的一项基础任务&#xff0c;目标是将连续的文本切分成有意义的片段&#xff0c;这些片段可以是句子、…

流量控制和差错控制

流量控制是一种协调发送站和接收站工作步调的技术&#xff0c;其目的是避免由于发送速度过快&#xff0c;使得接收站来不及处理而丢失数据。通常&#xff0c;接收站有一定大小的接收缓冲区&#xff0c;当接收到的数据进入缓冲区后&#xff0c;接收器要进行简单的处理&#xff0…

探索Dagster:现代数据编排的利器

探索Dagster&#xff1a;现代数据编排的利器 在如今数据驱动的世界&#xff0c;数据工程和数据处理的复杂度不断增加&#xff0c;不仅需要管理各种数据源和数据流&#xff0c;还需要确保数据处理管道的可靠性、可维护性和可扩展性。Dagster作为一个现代化的数据编排平台&#x…

java:使用shardingSphere访问mysql的分库分表数据

# 创建分库与分表 创建两个数据库【order_db_1、order_db_2】。 然后在两个数据库下分别创建三个表【orders_1、orders_2、orders_3】。 建表sql请参考&#xff1a; CREATE TABLE orders_1 (id bigint NOT NULL,order_type varchar(255) NULL DEFAULT NULL,customer_id bigi…

运算符和表达式

基本概念 运算符&#xff1a;根据特定的算法对操作数执行运算&#xff0c; 并返回计算结果的符号 操作数&#xff1a;参与运算的对象 表达式&#xff1a;计算的式子 1.算术运算 针对数字&#xff1a;加法。针对字符串&#xff1a;连接。针对复合型数据&#xff1a;合并。…

【需求设计】软件概要设计说明怎么写?概要设计说明书实际项目案例(63页Word直接套用)

软件概要设计说明书书写要点可以归纳为以下几个方面&#xff0c;以确保文档的准确性、完整性和可读性&#xff1a; 引言 目的&#xff1a;介绍编写该文档的目的、主要内容及目标读者。 背景&#xff1a;说明被开发软件的名称、项目提出者、开发者等背景信息。 需求概述&#xf…

【第3章】ComfyUI界面介绍(新增节点的3种方式/主工作区/工作流/设置/插件管理界面)ComfyUI基础入门教程

🥽主界面介绍 ComfyUI的工作界面,我们在上章节中已经见过了(如上所示)。 【注意】大家在网盘下载的comfyui版本,已经内置了很多实用节点,所以跟原始开源版本不一致,不过当前阶段不需要太在意这些。 这里我们快速了解下,界面上的这些区域,都分别是做什么的? 总体…