websocket学习笔记二

<template>
  <div>
    1111
    <el-button @click="submit">提交</el-button>
  </div>
</template>

<script>
export default {
  name: "AdminBetterWs",

  data() {
    return {
      url: "ws://123.207.136.134:9010/ajaxchattest",
      websocket: null,
      data: null,
    };
  },

  mounted() {},
  created() {
    this.init();
  },
  beforeDestory() {
    this.websocket.close();
  },
  methods: {
    init() {
      this.websocket = new WebSocket(this.url); //创建连接
      //四种事件
      this.websocket.onopen = this.onopen;
      this.websocket.onmessage = this.onmessage;
      this.websocket.onerror = this.onerror;
      this.websocket.onclose = this.onclose;
    },
    onopen() {
      this.status = "成功";
    },
    onmessage({ data }) {
      //客户端接收到服务端的消息
      this.data = data;
    },
    onerror() {
      this.status = "失败";
    },
    onclose() {
      this.status = "断开";
    },
    send(v) {
        //客户端向服务端发送的信息
      this.websocket.send(v);
    },
    submit() {
      this.send("111");
    },
  },
};
</script>

<style lang="scss" scoped>
</style>