Vue3解决ElementPlus自动导入时ElMessage无法显示的问题

vue3 ElementPlus自动导入时ElMessage无法显示

问题描述

使用Vue3时，ElementPlus引入方式为自动导入，需要添加ElMessage弹出提示

按照教程进行如下：

import {ElMessage} from 'element-plus'
ElMessage.error('需要填完所有项')

但浏览器不报错也不显示，后在网上查看他人相同问题后得知自动导入方式不需要import

解决

删除import行，直接使用ElMessage，成功解决

ElMessage.error('需要填完所有项')

element plus 使用ElMessage不生效或样式出现问题或出现在最底部

如下效果：

产生的原因是

使用了element plus的按需引入，然后在组件中 又

import { ElMessage } from 'element-plus' 

引入了一次，就会出现这个问题，

解决的方法

将组件中的引入删除，直接使用 

ElMessage.success('Successfully sent ！') 

总结

以上为个人经验，希望能给大家一个参考，也希望大家多多支持脚本之家。