首页 > 其他分享 >求助,路过的大佬帮忙看一下!!!!elment中input组件使用prefix-icon="el-icon-search"不加载图标

求助,路过的大佬帮忙看一下!!!!elment中input组件使用prefix-icon="el-icon-search"不加载图标

时间:2024-03-27 13:33:38浏览次数:27  
标签:el search vue app import 图标 icon

背景:创建了一个简单的vue工程想用测试一下el-input组件的功能,没有显示图标。代码如下所示

<template>
    <el-input v-model="value"
    placeholder="请输入内容"
    :disabled="false"
    :show-password="true"
    :clearable="true"
    prefix-icon="el-icon-edit"
    type="text"></el-input>
</template>

<script  setup>
import { ref } from 'vue'
const value = ref('')
</script>

 其中在main.js中定义了图标的加载

import { createApp } from 'vue'
import App from './App.vue'
import ElementPlus from 'element-plus'
import 'element-plus/dist/index.css'
// import * as ElIconModules from '@element-plus/icons'

import * as ElementPlusIconsVue from '@element-plus/icons-vue'



const app = createApp(App)
//  统一注册el-icon图标
// for(let iconName in ElIconModules){
//   app.component(iconName,ElIconModules[iconName])
// }
for (const [key, component] of Object.entries(ElementPlusIconsVue)) {
  app.component(key, component)
}
app.use(ElementPlus)
app.mount('#app')

 

标签:el,search,vue,app,import,图标,icon
From: https://www.cnblogs.com/lixianhui/p/18098958

相关文章

  • relocation overflow log
    问题背景:https://airflow-megengine.iap.hh-d.brainpp.cn/log?dag_id=megbrain-release&task_id=prebuild-cu111&execution_date=2022-10-08T06%3A06%3A51%2B00%3A00#megengine发版时,跑cu11.1prebuildFAILED,该错误挂在linkinglibmegengine.so,错误原因为relocationoverflow。......
  • John Deere Service Advisor EDL V3 Electronic Data Link Diagnostic Kit
    JohnDeereServiceAdvisorEDLV3ElectronicDataLinkDiagnosticKitisapowerfultooldesignedspecificallyforheavy-dutymachineryusedinconstruction,agriculture,enginesbyJohnDeere.Thisdiagnosticadapterisessentialfortechniciansandoper......
  • pageoffice6控制在线打开的Excel编辑区域(局部编辑)
    转发:控制Excel编辑区域(局部编辑)#控制Excel编辑区域(局部编辑)本示例关键代码的编写位置Vue+Springboot注意本文中展示的代码均为关键代码,复制粘贴到您的项目中,按照实际的情况,例如文档路径,用户名等做适当修改即可使用。在实际项目开发中,以下场景可能会用到Excel局部编辑......
  • SysTrayIcon 改的 python tkinter 最小化至系统托盘,适用TTK
    网上的SysTrayIcon改的,Tk页面最小化至托盘,托盘图标左键单击恢复Tk界面1.点击最小化隐藏至托盘2.托盘图标右键菜单展示,左键返回Tk界面。托盘图标可以自定义,修改了SysTrayIcon更容易调用,Demo窗口加了注释,具体查看_Main类。 代码如下: importwin32api,win32con,wi......
  • WPF自定义Panel:让拖拽变得更简单
       在WPF应用程序中,拖放操作是实现用户交互的重要组成部分。通过拖放操作,用户可以轻松地将数据从一个位置移动到另一个位置,或者将控件从一个容器移动到另一个容器。然而,WPF中默认的拖放操作可能并不是那么好用。为了解决这个问题,我们可以自定义一个Panel来实现更简单的拖......
  • selenium(8)断言,unittest
    Selenium中的断言用于验证应用程序的状态是否与所期望的一致。在使用Selenium进行自动化测试时,断言通常用于以下方面:页面属性断言:断言标题、URL或页面源码中是否包含或不包含特定字符。这是最常用的断言方式,可以用来断言页面是否正常打开,是否在指定的窗口及页面上。元素存在断......
  • 在创建的Vue工程中使用el-radio定义单选框,点击不显示效果
    之前在vue工程中的组件时下面这样的<template><el-radiov-model="radio"value="0">男</el-radio><el-radiov-model="radio"value="1">女</el-radio></template> 结果是点击不显示已选中 需要在script中引入vu......
  • el-table样式的设置
    1.更换表格每行背景颜色//设置表头的颜色/deep/.el-tabletheadtr>th{width:100%;background-color:rgb(22,18,102);border:none;}//去除每行的边框/deep/.el-tabletbodytr>td{//background-color:rgb(26,28,119);color:#fff;......
  • Xilinx ZYNQ 7000+Vivado2015.2系列(三)之HelloWorld实验(最小系统)(纯PS)
    前言:使用的板子是zc702。用Vivado的IP核搭建最小系统,包括ARM核(CPUxc7z020),DDR3(4×256M),一个UART串口(MiniUSB转串口),纯PS,通过串口打印出HelloWorld,工程虽小,五脏俱全,算是一种朝圣。配置要和板子对应,大家注意修改。操作步骤:硬件部分1.新建Vivado工程选择芯片型号xc7z020clg484_1......
  • Shell脚本编程基础
    Shell的作用——命令解释器Bash是一个用于GNU操作系统的shell,也就是命令解释器,这个名字是Borune-AgainSHell的缩写.重定向重定向输入<从指定的文件读取数据,而不是从键盘输入 重定向输出>将输出结果保存到指定的文件(覆盖原有内容)>>将输出结果追加到指定的文件 标准错误......