<el-input
v-model="input2"
class="w-50 m-2"
placeholder="Type something"
:prefix-icon="Search"
/>
安装官方的代码,不能显示出 search的图标;
解决办法:
1、安装
npm install @element-plus/icons-vue
2、main.js配置
// 导入所有的el-icon图标
import * as ElIconModules from '@element-plus/icons'
const app = createApp(App)
installElementPlus(app)
app.use(router).mount('#app')
// // 统一注册el-icon图标
for (const iconName in ElIconModules) {
app.component(iconName, ElIconModules[iconName])
}
3、vue文件中使用插槽方式使用
<el-form-item>
<el-input>
<template #prefix>
<el-icon class="el-input__icon"><search /></el-icon>
</template>
</el-input>
</el-form-item>
结果如图: