- 博客(25)
- 收藏
- 关注
RSS订阅原创 监听刷新浏览器，同步调用服务端接口
监听刷新浏览器，同步调用服务端接口场景代码场景项目中有个需求是，用户在录制视频的时候，刷新浏览器，自动停止录制。需要监听刷新事件去调后端停止录制视频的方法。经过实验发现：chrome、IE edge刷新时先执行onbeforeload()，新页面即将替换旧页面时执行onunload()。Firefox只有在刷新的时候两个都执行，关闭浏览器的时候只执行onbeforeload()。代码mounted(){ // beforeunload 的回调，弹出提示，确认是否刷新或关闭浏览器
2020-05-21 15:31:43
821
原创 JavaScript内存泄漏
JavaScript内存泄漏几种常见的内存泄漏：全局变量定时器或回调函数脱离DOM的引用闭包参考文章：https://mp.weixin.qq.com/s/rmCegO8ZVt5rhYqnEbgYjg
2020-03-30 15:07:02
171
原创 小程序中修改对象数组的值
小程序中修改对象数组的值catchtap解决事件冒泡问题 <text class="tagText" wx:else catchtap="setDefaultCommu" data-currentindex="{{index}}">设置为默认小区</text> data: { testObj:[{ id: 1, stateFlag: fa...
2020-03-24 17:25:03
899
原创 vue-router传值的三种方式
vue-router传值的三种方式第一种方式 ：path，query组合this.$router.push({path:'appealCenter/appealDetails', query: {prdId: row.prdId, deal: JSON.stringify(false) }})appealDetails中接收this.appealId = this.$route.qu...
2020-03-12 11:08:10
854
原创 element UI base64格式上传图片
element UI base64格式上传图片<el-form :model="ruleForm" :rules="rules" ref="ruleForm" label-width="150px" class="demo-ruleForm" label-position="left"> <el-form-item label="系统logo" prop="logoPhot...
2020-03-09 19:01:48
1290
原创 注册表单
注册表单（验证码&密码）vue+elementUI 实现手机号校验，发送验证码密码框点击眼睛可见不可见及密码确认 <el-form :model="registerForm" :rules="rules" ref="registerForm" label-width="120px" class="demo-registerForm"> <p>...
2020-03-04 12:08:18
288
原创 localStorage和sessionStorage 基本使用
localStorage和sessionStorage 基本使用localStorage和sessionStorage的基本使用 sessionStorage.setItem("deal",'a'); this.dealWith = sessionStorage.getItem("deal"); sessionStorage.removeItem("deal"); sessio...
2020-01-13 10:23:39
111
原创 键盘事件监听
键盘事件监听 document.onkeydown = function (e) { const key = window.event.keyCode; if (key == 13) { _this.loginJump('ruleForm'); } };
2019-11-08 16:47:10
216
原创 网页上websocket连接及基本使用
网页上websocket连接及基本使用 created() { this.websocket = io(process.env.WEBSOCKET_URL,{transports:['websocket']}); this.websocket.on('connect', () => { console.log('socket connected......
2019-11-07 20:28:48
1705
原创 每秒动态更新时间
每秒动态更新时间 currentTime: '', created() { //时间每秒更新 let time = setInterval(this.getCurTime,1e3); this.$once('hook:beforeDestroy', () => {clearInterval(time)}); } methods:{ getCurTi...
2019-11-07 20:20:17
363
原创 VUE router进入当前页面
VUE router进入当前页面全屏当前页面的时候遇到需要加载当前路由的问题，记录一下 console.log("this.$route", this.$route); this.$router.push({path:this.$route.path})...
2019-11-07 20:15:38
1509
原创 VUE 全屏页面
VUE 全屏页面1、点击全屏按钮进入全屏模式<img src="../../../assets/image/fullscreen_icon.png" class="full_icon" @click="rtPush"> rtPush(){ console.log("this.$route", this.$route); this.$router.pu...
2019-11-07 20:08:10
2637
原创 小程序表单校验
小程序表单校验在进行小程序校验的时候引入了wxvalidate.js进行校验。参考文章 https://blog.youkuaiyun.com/weixin_41041379/article/details/82017301但是提交表单的时候图片信息没有一同提交。所以提交的时候，虽然在验证规则里面定义了图片的校验，却一直提示没有上传。所以把图片有没有值单独拎出来验证是否为空。wxml文件<f...
2019-11-06 14:53:44
999
原创 flex布局实现上下固定高度，中间自适应布局
flex布局实现上下固定高度，中间自适应布局flex布局在实际开发中越来越常用，实现左右宽度或者上下高度固定，中间自适应的布局的实际需求也很常见。实现起来也很简单：<!DOCTYPE html><html lang="en"><head> <meta charset="utf-8"> <title>flex</title...
2019-07-29 10:01:50
16215
原创 数据库查询语句
数据库查询语句 this.sql = (this.allFaceType==0? `ftype_id in (1,2)`:`ftype_id=${this.allFaceType}`) + (this.tableTelephone ? ` AND phone=${this.tableTelephone}`:'') + (this.tableUserName ? ` ...
2019-07-22 09:24:10
139
原创 web开发中的常用单位
em 相对于父元素计算当前对象内文本的字体尺寸。rem 相对于根元素HTML元素font-size的倍数，计算大小。vw 相对于视口的宽度计算大小。vh 相对于视口的高度计算大小。vmin 以屏幕宽为边长的正方形。vmax 以屏幕高为边长的正方形。% 相对于父元素的百分比值。CSS3 calc()css中可以写成：height: calc(100% - 30px);...
2019-07-12 10:00:01
733
原创 select样式改写
select样式改写方法就是用外层的div覆盖原本的select样式，并去掉select的默认样式。option的样式找了很多资料都说是浏览器默认，不能修改，以后有时间再研究一下。<!DOCTYPE html><html><head> <meta charset="utf-8"> <title>New World&...
2019-05-17 13:16:43
1104
原创 实现文字两端对齐
实现文字两端对齐实现文字两端对齐，除了文本身要用空格隔开，设置text-align:justify; 及其他样式外，还需要在要两端对齐的文本后面加空标签或者伪元素。<h2>活 动 详 情<span></span></h2>.cityPart h2{ width: 200px; height: 30px; padding-left: 10...
2019-05-17 12:45:59
371
原创 HTTP协议类
HTTP协议类1. HTTP协议的主要特点简单快速、灵活、无连接、无状态。简单快速：每一个资源URI（图片，页面地址等）都是固定的，想访问某个资源输入URI就可以。灵活：通过一个HTTP协议可以完成不同数据类型的传输。无连接：连接一次就会断开，不会始终连接。无状态：服务端不能区分两次连接者是不是同一个用户。2. HTTP报文的组成部分请求报文：请求行、 请求头、 空行、 请求体响...
2019-05-14 15:30:41
107
原创 JavaScript 类型转换
JavaScript 类型转换1. 数据类型原始类型：Boolean 、 Null 、 Undefined 、 Number 、String 、 Symbol对象Object2. 显示类型转换Number函数：数值 ---- 数值字符串 ---- 若能解析成数值，则转换为相应数值，否则得到NaN。空字符串转为0布尔值 ---- true 1， false 0undef...
2019-05-14 12:31:50
115
原创 DOM事件
DOM事件1. DOM事件级别DOM0 element.οnclick=function(){}DOM2element.addEventListener(‘click’, function(){}, false)DOM3 增加了鼠标事件，键盘事件等element.addEventListener(‘keyup’, function(){}, false);2. DOM事件模型...
2019-05-14 11:15:01
87
原创 JS实现slideDown()和slideUp()效果
JS实现slideDown()和slideUp()效果这两天在写一个小Demo，页面顶部需要实现webAPP那种将导航收起，通过按钮点击显示与隐藏的效果。实现过程中也花费时间挺久的，现在单独将这部分拎出来记录一下。废话太多了，直接上代码：<!DOCTYPE html><html lang="zh-cn"><head><meta charset="...
2019-04-26 17:51:23
6728
原创 ES6
ES61. let块级作用域：一个{ }就是一个块级作用域，在 { }中使用 let 关键字和const关键字声明的变量，在 { } 外面访问不到。如for{ }, if{ }, 对象{ }； { }如果想表示一个对象 不可以放在行首，可以给它赋值或者用括号包起来({ })。如果放在行首就会看成是一个块级作用域。let 声明的变量没有变量提升不可以重复声明不会给window增加属性，v...
2019-04-24 20:09:00
939
原创 父元素宽高固定的情况下，子元素宽高100%、auto
子元素为block、inline-block、float时与其宽高100%、auto的影响以下分三种情况介绍（子元素分别为block、inline-block、float三种情况。每种情况分四类：宽高同为百分比、宽为auto高为百分比、宽为百分比高为auto、宽高同为auto。）。一、子元素display:block;1.1、子元素宽高都为父元素的百分比。width:70%;与height:...
2019-04-09 11:25:19
2302
1
原创 CSS盒模型
CSS盒模型1. 标准盒模型与IE盒模型css盒模型分为标准模型 和IE模型两类，两者的区别就是宽高包含范围的区别：标准模型 盒子的宽 = width；IE模型盒子的宽 = border+padding+width。浏览器默认为标准盒模型box-sizing:content-box。要想设置为IE盒模型，设置box-sizing:border-box就可以实现。2.JS如何设置盒模型对应...
2019-04-02 18:47:49
84
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人