Vue+Element-ui弹窗 this.$alert is not a function --已解决！！！-前端-E先生的博客

使用问题

在别的项目使用Element-ui官网上单独引用MessageBox的话需要在import中加入MessageBox。

单独引用截图

单独引用使用截图

具体代码如下：

main.js:
import Vue from 'vue';
import { DatePicker, MessageBox, Message, } from 'element-ui';
import App from './App.vue';
Vue.component(DatePicker.name, DatePicker,);
Vue.component(MessageBox.name, MessageBox,);
Vue.use(Message)
/* 或写为
 * Vue.use(Button)
 * Vue.use(Select)
 */
Vue.prototype.$msgbox = MessageBox;
Vue.prototype.$alert = MessageBox.alert;
Vue.prototype.$confirm = MessageBox.confirm;
Vue.prototype.$prompt = MessageBox.prompt;
Vue.prototype.$message = Message;
new Vue({
  el: '#app',
  render: h => h(App)
});

单独引用：

self.$alert('这是一段内容', '标题名称', {
  confirmButtonText: '确定',
  callback: action => {
    self.$message({
      type: 'info',
      message: `action: ${action}`
    });
  }
});

自此完美解决

本文来自E先生的博客，如若转载，请注明出处：https://www.javajz.cn