![](https://img-blog.csdnimg.cn/20201014180756916.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
vue
阳光6号
这个作者很懒,什么都没留下…
展开
-
使用gzip压缩大量文本,然后提交给后台接口
开发过程中,日志接口使用http定时发送给后台接口,日志传输涉及到大量数据,经开发协商决定先把大量的日志文本压缩,然后再发送给接口,提高发送数据的速度和成功率,压缩方式是gzip相关压缩库的文件是:https://github.com/nodeca/pako/tree/master/dist/pako_deflate.min.js代码:let pako = require('../js/pako_deflate.min.js');let binaryArray = pako.gzip('大量文本'原创 2021-04-16 16:36:46 · 311 阅读 · 0 评论 -
vue中使用watch监听对象,监听方法没有被触发的原因
watch: { friendList:{ //注意,这里是对象 handler(val){ }, deep:true }},computed:mapGetters({ friendList:'getFriendList'}),mounted(){ this.$store.dispatch('editFriendList', hy.friendList);}下面是vuex中,mutations的内容:EDIT_FRIEND_LIST (state, data) {原创 2020-11-13 18:40:41 · 4703 阅读 · 1 评论 -
electron-vue开发模式,每次修改代码热更新的时候,无法杀死electron进程重启,导致CPU很高,电脑卡死
这是由于每次修改源码的时候,重启了多次electron进程,热更新的时候没有彻底杀死进程重启,导致多个进程一起工作,占用大量CPU,电脑卡死,解决方法,修改热更新重启进程的方法,找到dev-runner.jsif (electronProcess && electronProcess.kill) { manualRestart = true process.kill(electronProcess.pid) electronProcess原创 2020-10-15 10:01:58 · 2726 阅读 · 0 评论 -
vue判断iframe是否加载完毕
html<main> <img v-show="!completeLoad" src="../images/loading.gif"/> <iframe v-show="completeLoad" :src="url" width="100%" id="license_iframe" height="100%"></iframe></main>jsmounted () { var _this = this const ifra原创 2020-09-09 16:19:49 · 3928 阅读 · 0 评论 -
javascript使用gzip压缩数据后传输给后端
使用场景:app的日志接口需要大量提交日志给服务器,每30s提交一次,一次性最多提交50条日志数据,日志信息包含大量文本数据,导致数据传输量大,故后端的接口改成接受gizp压缩后的数据流java接口定义:前端javascript请求:let binaryArray = pako.gzip(JSON.stringify(params));let buffer = new Uint16Array(binaryArray).bufferlet url = _configServer.LOG_SERVI原创 2020-08-28 11:04:52 · 2842 阅读 · 0 评论 -
给JSON数组对象排序
//先按照status排序//如果status一样,再按照name字段排序return this.toyList.sort((a, b) => { if (a.status === b.status) { return b.name.charAt(0) > a.name.charAt(0) ? -1 : 1 } return b.status - a.status })...原创 2020-07-09 14:46:20 · 164 阅读 · 0 评论 -
css实现带阴影效果的三角形箭头下拉菜单
先看效果:小三角形的边框和矩形菜单四周,都有阴影实现思路:div+伪类<div class="menu-list"> <div class="menu-item">Backup and Restore</div> <div class="menu-item" style="border-bottom:none;" @click="signOut" > Sign Out </div></div>css:.m原创 2020-06-30 18:30:17 · 864 阅读 · 0 评论 -
vue父组件从接口获取数据后传给子组件(父组件延迟传值)
data() { return { logoCss: { width:0, height:0, defaultImgUrl: null, }, } }, <mobileWidget v-if="logoCss.defaultImgUrl != null" :logo-css="logoCss" />如上图,mobileWidget是子组件,父组件的logoCs..原创 2020-06-23 21:03:05 · 4628 阅读 · 1 评论 -
Vue devTools的安装及使用
Vue devTools的下载地址:https://github.com/vuejs/vue-devtools直接点击下载添加到chrome extension添加成功后右上角能看到vue的调试插件:运行vue 项目,打开开发者调试工具,选择vue,如下:就能看到vue里面的数据状态,这样子调试相比断点或者console等方法会高校很多...原创 2020-06-18 14:19:28 · 101 阅读 · 0 评论 -
vue实现组件拖拽功能
/*组件拖拽插件 在vue中使用方法:导入此插件,使用mixins混入对象在需要拖拽的元素添加如下方法即可:<div οndragstart="return false;" οndrοp="return false;" draggable="false" @mouseup="onMouseup" @mousedown="onMousedown($event)"@mousemove="dragMouseMove($event)"></div>*/export const原创 2020-06-17 18:02:30 · 1106 阅读 · 0 评论 -
在其它js模块触发当前vue组件的watch监听方法
this.$set(this, "requestStatus", hy.messageRequest);this指向vue组件,requestStatus是当前vue通过watch监听的对象,hy.message是其他js文件导出模块后,挂载到全局的对象。上面代码在mounted注册后,实现的功能:hy.messageRequest对象被改变后,会触发当前vue组件的watch对requestStatus的监听方法。也就是说,当前vue组件监听了requestStatus对象的某属性,比如:wa原创 2020-06-04 11:06:06 · 659 阅读 · 0 评论