上代码:

create:function(){

this.initWebpack()

}

methods:{  

initWebpack(){//初始化websocket
          let user = JSON.parse(localStorage.getItem('user')) 
          let userId = user.user.userId
          const wsuri = "ws://xxx.xxx.xxx.xxx:8086/webSocket?id="+userId+"&code=1";      //连接数据获取不到数据配合后端加个参数试试
          this.websock = new WebSocket(wsuri);
          this.websock.onopen = this.websocketopen;
          this.websock.onmessage = this.websocketonmessage;
          this.websock.onclose = this.websocketclose;
          this.websock.onerror = this.websocketerror;
        },
        websocketopen(){//打开
          console.log("WebSocket连接成功")
        },
        websocketonmessage(e){ //数据接收
          consolo.log(e)
        },
        websocketclose(){  //关闭
          console.log("WebSocket关闭");
        },
        websocketerror(){  //失败
          console.log("WebSocket连接失败");
        },
        websocketsend(date){
          this.websock.send(date)
        },
}

vue使用websoket(非封装)的更多相关文章

  1. 聊聊 Vue 中 axios 的封装

    聊聊 Vue 中 axios 的封装 axios 是 Vue 官方推荐的一个 HTTP 库,用 axios 官方简介来介绍它,就是: Axios 是一个基于 promise 的 HTTP 库,可以用在 ...

  2. Vue中axios的封装和api接口的统一管理

    更新的是我csdn上的文章,需要的话可以看下,互相学习点击去我的csdn vue中axios的封装 在vue项目和后端交互获取数据时,通常使用axios库,官方文档:https://www.npmjs ...

  3. vue中的axios封装

    import axios from 'axios'; import { Message } from 'element-ui'; axios.defaults.timeout = 5000;axios ...

  4. vue中Axios的封装和API接口的管理

    前端小白的声明: 这篇文章为转载:主要是为了方便自己查阅学习.如果对原博主造成侵犯,我会立即删除. 转载地址:点击查看 如图,面对一团糟代码的你~~~真的想说,What F~U~C~K!!! 回归正题 ...

  5. vue中axios的封装

    第一步还是先下载axios cnpm install axios -S 第二步建立一个htttp.js import axios from 'axios'; import { Message } fr ...

  6. vue中动画的封装

    <style> .v-enter,.v-leave-to{ opacity: 0; } .v-enter-active,.v-leave-active{ transition:opacit ...

  7. Vue兄弟组件(非父子组件)状态共享与传值

      前言:网上大部分文章写的有点乱,很少有讲得易懂的文章. 所以,我写了篇在我能看得懂的基础上又照顾到大家的文章 =.= 作者:X1aoYE 备注:此文原创,转载请注明~  内容里的<br> ...

  8. vue+element UI + axios封装文件上传及进度条组件

    1.前言 之前在做项目的时候,需要实现一个文件上传组件并且需要有文件上传进度条,现将之前的实现过程简单记录一下,希望可以帮助到有需要的人. 项目用的是Vue框架,UI库使用的是element UI,前 ...

  9. 简述vue props和非props的2个特性

    props的2个特性 ①:父组件通过属性的方式传值(比如下面截图中的content)给子组件,content不会显示在DOM节点中                       ②:父组件向子组件传递值 ...

  10. Vue.js 自定义组件封装实录——基于现有控件的二次封装(以计时器为例)

    在本人着手开发一个考试系统的过程中,出现了如下一个需求:制作一个倒计时的控件显示在试卷页面上.本文所记录的就是这样的一个过程. 前期工作 对于这个需求,自然我想到的是有没有现成的组件可以直接使用(本着 ...

随机推荐

  1. rnacos 版本更新为 v0.1.4

    rnacos是一个用 rust重新实现的nacos. 周一发布 rnacos 后,有收到部分对2.0版本兼容问题的反馈. 主要是nacos2.0版本的注册心跳与1.0不同,rnacos之前没对2.0版 ...

  2. LOTO任意波形发生器SIG82模拟输出继电器吸合断开的信号波形用于算法调试

    LOTO任意波形发生器SIG82模拟输出继电器吸合断开的信号波形用于算法调试 继电器吸合的电流变化过程是如图这样的波形,0到2的时间大约为17毫秒,2到3的时间大约38毫秒. 批量继电器产品吸合是否满 ...

  3. IDEA彩虹括号插件Rainbow Brackets

    IDEA搜索插件Rainbow Brackets 安装后重启IDEA 效果如图:不同层级的括号会变成不同的颜色,便于区分. 光标定位到前一个括号后,使用快捷键ALT+鼠标右键可以只查看当前括号中的内容 ...

  4. #ST表,单调栈#洛谷 5648 Mivik的神力

    题目 分析 考虑答案应该是一段单调不下降的序列, 考虑预处理出每个点往后第一个大于这个点的位置, 那么答案应该是左端点到区间内最大的位置以及这个位置到右端点的贡献 那么区间最大的位置可以用ST表做,然 ...

  5. VS 2020制作安装包

    VS制作安装包的一般步骤. 一·新建项目 (1)新建 (2)界面跳转 二·添加引用 (1)添加卸载程序 1.在'C:WINDOWSsystem32'路径下,找到msiexec.exe . 2.将msi ...

  6. HarmonyOS“一次开发,多端部署“优秀实践——玩机技巧,码上起航

    随着终端设备形态日益多样化,分布式技术逐渐打破单一硬件边界,一个应用或服务,可以在不同的硬件设备之间按需调用.互助共享,让用户享受无缝的全场景体验.作为应用开发者,广泛的设备类型也能为应用带来广大的潜 ...

  7. 重新点亮linux 命令树————文本查看vi和vim[五]

    前言 简单整理一下vi和vim,主要介绍一下四种模式. 正文 四种模式分别是: 正常模式(normal-mode) 插入模式(insert-mode) 命令模式(command-mode) 可视模式( ...

  8. https http2 http3

    HTTP 1.1 对比 1.0,HTTP 1.1 主要区别主要体现在: 缓存处理:在 HTTP 1.0 中主要使用 header 里的 If-Modified-Since,Expires 来做为缓存判 ...

  9. sass的用法重温

    Sass使用变量,变量以$开头 $bgcolor:#f40; background-color:$bgcolor; 如果变量需要嵌套在字符串当中,就需要写在#{}之中 $direction:left; ...

  10. 力扣608(MySQL)-树节点(中等)

    题目: 给定一个表 tree,id 是树节点的编号, p_id 是它父节点的 id . 树中每个节点属于以下三种类型之一: 叶子:如果这个节点没有任何孩子节点.根:如果这个节点是整棵树的根,即没有父节 ...