VUE中使用elementUI，弹窗以及消息通知

目前组里就我一个搞软件的，本来是搞java，现在也要维护更新前端的东西，真是难顶啊

机器人云平台需要加报警弹窗的功能，目前想的是后台拿到报警信息，通过websocket推送到前台，前台是elementui搭建的，去官网找相应的组件

第一步，先把之前的websocket代码放到 < script > 里面，我放的是最下面，放在上面好像会因为加载顺序出问题

// 打开一个WebSocket:
    var ws = new WebSocket('ws://127.0.0.1:12340/chat');
    
    //open event
    ws.onopen = function() {
        console.log("open websocket...");
    };
    
    //close event
    ws.onclose = function() {
        console.log("close websocket...");
    };
    
    // 响应onmessage事件:
    ws.onmessage = function(msg) { 
        //这里可以处理接收到服务器的数据
        console.log(msg); 
    };
    
    function ws_send(){
        // 给服务器发送一个数字
        ws.send(document.getElementById('input_msg').value);
        
    }

第二部，添加组件

我的想法是，把这段代码，放到websocket的 响应onmessage事件里:

ws.onmessage = function(msg) { 
    //这里可以处理接收到服务器的数据
    console.log(msg); 
 
};

但是不成功，vue的方法都放在methods里面，不能放在这里，往下看文档，说到了全局调用：

在onmessage事件里通过$alert(message, title, options)还是没成功，

往下看到局部引入：

先引入：

import { MessageBox } from 'element-ui';
import { Notification } from 'element-ui';
import { Message } from 'element-ui';

我把消息提示、弹窗、通知都引入了

通过Message(options)调用时候，options为参数，标题、消息、之类的，这里要注意，options需要用{}包裹，形同：

弹窗效果：

通知效果：

消息提示效果：