Vue ElementUI 中报错:this.$message is not a function

Posted impedro

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了Vue ElementUI 中报错:this.$message is not a function相关的知识,希望对你有一定的参考价值。

原因:
在单独按需引入element组件时,message组件需要挂载到Vue全局对象上,而不是用Vue.use(Message),这是message组件与其他组件不同的地方。其中与之相同、需要挂载到Vue全局对象上的,还有confirm组件。

Vue组件中:

1 methods:{
2     open2() {
3       this.$message({
4         message: "恭喜你,这是一条成功消息",
5         type: "success"
6       });
7     },
8 }

 

main.js 中:

1 import { Message } from "element-ui";
2 Vue.use(Message);
3 Vue.prototype.$message = Message;

 

参考:https://www.jianshu.com/p/b720a91f6ee3

以上是关于Vue ElementUI 中报错:this.$message is not a function的主要内容,如果未能解决你的问题,请参考以下文章

解决vue中报错 Duplicate keys detected:‘1‘. This may cause an update error.

webpack调用vue中报错, [WDS] Disconnected!解决方法

webpack调用vue中报错, [WDS] Disconnected!解决方法

解决ElementUI导航栏重复点菜单报错问题

解决vue中报错 TypeError: Cannot read properties of undefined (reading ‘value‘)“

解决elementUI中使用el-submenu的路由模式会报错的问题