【问题随记】关于 ElementPlus 样式无法加载完全的问题

举报
繁依Fanyi 发表于 2024/10/25 20:53:26 2024/10/25
【摘要】 问题记录代码中使用了 el-input,但是 el-input 未加载完全,仅显示普通未渲染的输入框。<el-form label-width="0px" class="login_form"> <!--用户名--> <el-form-item> <el-input prefix-icon="el-icon-search" style="width:100%"><...

问题记录

代码中使用了 el-input,但是 el-input 未加载完全,仅显示普通未渲染的输入框。

<el-form label-width="0px" class="login_form">
    <!--用户名-->
    <el-form-item>
        <el-input prefix-icon="el-icon-search" style="width:100%"></el-input>
    </el-form-item>
</el-form>

image.png

问题解决

引入 element-plus 的 css 样式即可。关键语句:import 'element-plus/dist/index.css'

import { createApp } from 'vue'
import App from './App.vue'
import Router from './router/router.js'
import "./assets/css/global.css"
import ElementUI from 'element-plus'
import 'element-plus/dist/index.css' // 引入样式

createApp(App).use(Router).use(ElementUI).mount('#app')

el-input 正常显示。

image.png

【版权声明】本文为华为云社区用户原创内容,未经允许不得转载,如需转载请自行联系原作者进行授权。如果您发现本社区中有涉嫌抄袭的内容,欢迎发送邮件进行举报,并提供相关证据,一经查实,本社区将立刻删除涉嫌侵权内容,举报邮箱: cloudbbs@huaweicloud.com
  • 点赞
  • 收藏
  • 关注作者

评论(0

0/1000
抱歉,系统识别当前为高风险访问,暂不支持该操作

全部回复

上滑加载中

设置昵称

在此一键设置昵称,即可参与社区互动!

*长度不超过10个汉字或20个英文字符,设置后3个月内不可修改。

*长度不超过10个汉字或20个英文字符,设置后3个月内不可修改。