-=｜=--CSDN博客

原创 vue和xterm.js和websocket以及ws心跳（防止ws长时间搁置断开连接）

npm install --save xterm-addon-fitnpm install --save xterm<template> <div class="box"> <div id="xterm"></div> </div></template><script>import { Terminal } from "xterm";import { FitAddon } from "xterm

2020-06-22 18:38:46 3853 16

原创 vue各种稀奇插件

Codemirror 在vue里面使用codemirror，动态创建编辑器Sortable vue表格拖拽插件Draggable Draggable为基于Sortable.js的vue组件，用以实现拖拽功能。后续慢慢加，用到就写上。

2020-06-18 11:20:47 542

原创 vue前端下载后端返回的文件流

axios({ method: 'get', url: urls + `/apis/v1alpha1/files/result/${row.path}`, responseType: 'blob', headers:{ Authorization:token } }).then((res) => { console.log(res)

2020-06-08 15:27:35 4503 5

上传文件在项目中经常遇到，但是上传文件如果文件过大的话，就容易出现两个问题：1.如果网络不稳定，比较大的文件传输容易失败2.大文件太浪费时间，中途推出去肯定是有问题的所以，断点续传就出现了，断点续传在我的理解看来无外乎以下几点要素：1.判断文件大小，文件大于我们规定的某个大小后，我们对文件进行切割2.切割后的文件组成一个数组，循环传输数组中的每一个小文件3.当我们把所有的小文件传输完毕后告诉后端，我传递完毕了，让后端进行拼接，把小文件拼接成原来的大文件...

2020-09-26 15:02:25 1942 1

原创 vue点击复制功能

copyCommand(str) {str是要复制的内容 var _input = document.createElement("input"); // 直接构建input _input.value = str; // 设置内容 document.body.appendChild(_input); // 添加临时实例 _input.select(); // 选择实例内容 document.execCommand("Copy"); // 执行复制 this.$messa

2020-06-05 15:45:04 251

原创 vue页面刷新动画

做一个vue的页面刷新动画，找了好多动画样式，感谢大佬们造的轮子。。。主要就是在index.html文件里面写一个动画样式，在页面刷新的时候让他去前面做动画，等我们的样式可以加载的时候去把这个动画样式给移除掉就可以了，而判断我们的样式是否加载好可以用created生命周期去判断，因为这个生命周期是在浏览器解析完html的各种样式后触发的，所以可以在app.vue的created生命周期里面把动画样式移除接下来是代码index.html里面的代码css样式：<style type="text/

2020-06-03 17:00:21 1856 1

原创 vue实现右键菜单栏

vue实现右键菜单栏和原生js大同小异，都是需要明白两个点1.contextmenu事件是鼠标的右键点击事件2.要阻止浏览器的默认右键事件代码如下// methodsrightShow() { let menu = this.$refs.msgRightMenu this.isPersoncontextMenus = true var evt = event || window.event; var clientWidth = document.documentElement.clien

2020-06-03 12:06:34 1576

转载修改滚动条的默认样式

css样式/*修改滚动条样式*/div::-webkit-scrollbar{ width:10px; height:10px; /**/}div::-webkit-scrollbar-track{ background: rgb(239, 239, 239); border-radius:2px;}div::-webkit-scrollbar-thumb{ background: #bfbfbf; border-radius:10px;}div::-webkit

2020-06-01 18:18:45 234

原创在vue中使用webSocket

webSocket经常用于需要后端主动发送数据给前端的场景，因为我做的一个项目中需要时时刷新列表里面的状态，而用定时任务去刷状态太过耗费性能，所以使用了webSoclet，下面是代码下面展示一些内联代码片。// webSocet init: function(url,getMessage) { if (typeof(WebSocket) === "undefined") { alert("您的浏览器不支持socket") } else { // 实例化socket this

2020-06-01 11:45:23 723

l17606145618的博客