- 博客(21)
- 收藏
- 关注
RSS订阅原创 页面中多个录音audio+＜el-slider＞拖动进度条
html<el-slider v-model="item.playProcess" class="sliderClass" style="width: 100%;" @change="setProcessFunc" :show-tooltip="false" ...
2022-05-17 13:56:26
545
原创 van-uploader 封装上传图片，上传文件
1.<van-uploader v-model="fileLists" :name="name" :accept="''" :preview-size="previewSize || '80px'" :preview-image="previewImage || true" :preview-full-image="previewFullIma...
2022-05-17 13:32:36
2272
原创 websocket实现已读未读
1.引入websocket.js到项目里,附上websocket.js代码class Echo { // // ws 服务地址 // public addr; // // ws 要监听的事件 // public events; // // 当前是否正在重联络 // public isRetrying; // // ws 实例 // public ws; // // 注册的 error 回调 // public errorCallback;...
2022-05-10 13:37:30
2080
原创 h5页面对返回首页的组件 ，吸边拖拽
<div class="home-back" @click='backHome'> <img :src="homeIcon"> </div>dragIcon(){ let drag = document.querySelector('.home-back') // let test = document.querySelector('.test') let dragHeight = d...
2022-04-02 09:40:01
256
原创 前端权限系统设计
“权限管理”一般在大家的印象中都属于后端的责任，但这两年随着 SPA 应用的兴起，很多应用都采用了前后端分离的方式进行开发，但是纯前端的开发方式就导致，以前很多由后端模板语言硬件解决的问题，现在势必要重新造一次轮子。而如果要重造轮子，前端er 就要根据对应的公司业务需求和后端er 一起配合，基于需求和安全性来考虑，来实现这个动态路由了。所以考虑到以上的痛点和具体的业务需求。今天我会模拟前端请求后端，获取用户权限，实现RBAC，带你从登录到验证、鉴权，最终实现动态 RBACRABC 的功能。这样一来，
2022-03-09 16:44:24
1156
原创 h5页面dom节点转化为canvas,实现图片保存到本地
1、下载html2canvas 包 引入import html2canvas from 'html2canvas'2、 <div id="box"><img :src="canvas"></div>let _this = this;_this.$nextTick(()=>{html2canvas(document.getElementById("box")).then((canvas)=> ...
2022-03-09 16:35:52
1257
原创 封装---小程序上传图片，限制图片的格式和大小
export default function(type, callBack) { let isUpload = true return new Promise((resolve, reject) => { wx.chooseImage({ count: 1, success: res => { let types = res.tempFiles[0].path.subst...
2022-03-09 16:24:23
1425
原创 小程序---canvas常见用法及总结
1、wx.createCanvasContext创建 canvas 的绘图上下文2、wx.getSystemInfoSync. windowWidth可使用窗口宽度3、wx.getImageInfo获取图片信息4、drawImage绘制图像到画布5、globalCompositeOperation = " source-over"调整层级6、setFillStyle设置填充色。7、setFontSize设置字体的字号8、setTextAlign设置
2022-03-07 16:36:46
1404
原创 管理后台---批量导出excel，或者单个导出word
1、拿到你的数组，join成字符串2、封装单个导出还是批量导出export function resolveFileBlob(res/*返回信息*/, fileName /*文件名*/) { console.log(res) let blob = new Blob([res['data'] || res], {type: res.headers['content-type']}) //新建blob对象获取当前文件格式 const disposition = re...
2022-02-28 19:30:27
315
原创 vue管理后台列表实现拖拽
1、引入js方法"sortablejs": "^1.14.0",npm install sortablejs --saveimport Sortable from 'sortablejs'2、rowDrop() { const tbody = document.querySelector('.el-table__body-wrapper tbody') const _this = this Sortable.create(tbody, {...
2022-02-14 10:05:32
449
原创 van-count-down 小程序如何使用van-count-down
<span class="van-count-down-box"> <van-count-down :time="overTime" /> </span>获取时间，单位是毫秒，就不需要除以1000， 接口的时间，我这里格式是 2021-12-01 23：59：59let endTime = new Date(接口的时间).getTime()let start_time = new Date().ge...
2021-11-26 17:14:28
2630
原创 vue如何在watch中监听对象
我要实现的效果是，输入框都有值，按钮是黄色，只有有一项为空，按钮置灰。<div :class="noKValue == true ? 'backffcc33':'backccc' " >按钮</div>watch: { // 监听 只要有一项为空 底部按钮就是灰色 对象名:{ handler(nv,ov){ let noKValue = true ...
2021-11-22 15:01:59
806
原创 小程序订阅消息 一次性订阅-最全踩坑记录
原代码：wx.getSetting({ withSubscriptions: true, success: function(res){ console.log(res,'成功') if (res.subscriptionsSetting.mainSwitch) { if (res.subscriptionsSetting.itemSettings != null && re...
2021-11-17 16:58:32
2714
1
原创 如何在小程序接入埋点
1、在main.js里//接入友盟统计,放到最前面import uma from 'umtrack-wx';uma.init({ appKey: '614b0b1716b6c75de06cd8eb', //由友盟分配的APP_KEY // 使用Openid进行统计，此项为false时将使用友盟+uuid进行用户统计。 // 使用Openid来统计微信小程序的用户，会使统计的指标更为准确，对系统准确性要求高的应用推荐使用Openid。 useOpenid: true, ...
2021-10-15 11:03:24
995
原创 vue组件子传父，传对象，传复杂数据的时候传输失败，怎么解决
1、这个方法可以试一试，不一定能实现watch:{prop_detail:{//对象，所要传的对象，在props也需要写 deep:true, immediate:true, handler(nv){ this.detail=nv,//这个地方看能不能拿到nv,如果能拿到，赋值可能也会有问题 }},}2、能实现，拿到父 页面的数据detailShow(nv){//是我的弹窗名字...
2021-09-29 13:58:13
645
原创 vue 使用van-field输入框，输入时让键盘弹起，如何获取键盘的高度
1、<van-field@focus="focusTextarea"/>2、在最外层的盒子 css :style="{paddingBottom:inputBottom+'px'}"3、在输入框的盒子上写<van-cell-group:style="{bottom:inputBottom+'px'}"><van-field@f...
2021-09-29 13:43:12
4505
2
原创 修改浏览器滚动条的样式
//修改滚动条样式::-webkit-scrollbar {width: 4px;/*height: 4px;*/}::-webkit-scrollbar-thumb {border-radius: 10px;-webkit-box-shadow: inset 0 0 5px rgba(0,0,0,0.2);background: rgba(0,0,0,0.2);}::-webkit-scrollbar-track {-webkit-box-shadow: inset 0 0 5px
2021-09-18 09:38:09
97
原创 滚动条到顶部的距离，元素距离顶部的距离
滚动条距离顶部的距离 document.documentElement.scrollTop||document.body.scrollTop元素距离顶部的距离document.getElementsByClassName('see-talk-teacher')[0].offsetTopsee-talk-teacher是你的class类名，注意加上[0]滚动条 距离顶部的距离大于 元素距离顶部的距离，可以实现元素放大缩小的功能，放大缩小transform:scale(1.2)；t...
2021-09-13 16:19:53
2087
原创 数组操作方法
join()，数组转化字符串replace(/[\r\n]/g,"") 去掉所有换行符号replace(/,/g,'') 去掉字符串的,号
2021-09-08 18:52:41
73
原创 new Date时间格式，是横线的格式还是斜杠的格式，解决ios和安卓兼容
newDate(时间.replace(/-/g,"/")).getTime()/1000,转换下格式，在时间后面加上一个replace(/-/g,"/")
2021-08-19 14:03:09
466
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人