element-plus提示框显示位置不正确

最新推荐文章于 2024-06-17 14:32:03 发布

一只大菜鸟J

最新推荐文章于 2024-06-17 14:32:03 发布

阅读量683

点赞数 2

文章标签： vue.js elementui

本文链接：https://blog.csdn.net/weixin_46029283/article/details/129838532

版权

文章提供了一个错误的配置示例，然后介绍了修复该问题的正确方法，包括在main.ts中导入Vue,App.vue,路由器,ElementPlus组件库以及天地图密钥的设置。通过调整ElementPlus的大小和Z-index，以及注册所有ElementPlus图标组件，最后将应用挂载到#app容器上。

摘要由CSDN通过智能技术生成

错误示例：

解决方法：

根据官网先配置好，最后在main.ts在加入以下红色代码重启即可。

import { createApp } from 'vue'
import App from './App.vue'
import router from './router/router'
import ElementPlus from 'element-plus'
import * as ElementPlusIconsVue from '@element-plus/icons-vue'
import "element-plus/theme-chalk/el-message.css";
import "element-plus/theme-chalk/el-message-box.css";

const app = createApp(App);
// 路由
app.use(router);
app.use(ElementPlus, { size: 'small', zIndex: 3000 })
for (const [key, component] of Object.entries(ElementPlusIconsVue)) {
app.component(key, component)
}
// 天地图密钥
app.provide('$TiandituKey','be50c7492442ecf4e61ca7bd578d6b8b');
app.mount('#app')