- 博客(46)
- 收藏
- 关注
RSS订阅原创 error @typescript-eslint/[email protected]: The engine “node“ is incompatible with this module. Ex
时报错：error @typescript-eslint/[email protected]: The engine “node” is incompatible with this module. Expected version “^18.18.0 || >=20.0.0”. Got “18.16.0”
2024-03-21 11:37:41
281
1
原创 前端实现电子签名（web、移动端）通用组件
进行修改，因为小程序中是没有dom，既然没有dom，哪来的操作dom这个操作呢。在小程序中我们如果需要实现的话，也是同样的原理，只是我们需要将。进行创建（2.9.0）之后的库不支持。如果是uni-app则需要使用。如果是原生微信小程序则使用。
2023-03-27 14:44:38
215
原创 前端技术实现文件预览（word、excel、pdf、ppt、mp4、图片、文本）
Demo地址: https://zhuye1993.github.io/file-view/dist/index.html实现方案首先npm i pdfjs-dist设置PDFJS.GlobalWorkerOptions.workerSrc的地址通过PDFJS.getDocument处理pdf数据，返回一个对象pdfDoc通过pdfDoc.getPage单独获取第1页的数据创建一个dom元素，设置元素的画布属性通过page.render方法，将数据渲染到画布上下载exceljs、
2023-03-24 16:42:46
747
原创 千分位分隔符保留指定位数小数
//千分位分隔符 num:数字 len:保留小数点位数export function formatNumber(num,len) { num = num + ""; if (!num.includes(".")) { num += "."; } else { num = Number(num).toFixed(len).toString(); } let val = num .replace(/(\d)(?=(\d{3})+\.)/g, function ($0
2022-05-26 17:53:47
504
原创 获取本周本月本季本年第一天，获取今天星期几、当前日期的前一天
获取本周第一天getFirstDayOfWeek() { let nowTime = new Date(); let aa = nowTime.setDate(nowTime.getDate() - nowTime.getDay() + 1); let week = nowTime.getFullYear() + "-" + (nowTime.getMonth() + 1) + "-" + nowTime.getDate(); return week; },获取本月
2022-05-26 17:48:45
541
原创 el-cascader 异步加载子节点数据+模糊搜索
需求点el-cascader一共两级，第一级数据由接口返回；点击第一级的展开icon，拿第一级的id去请求接口获取第二级的数据；el-cascader需带有模糊搜索功能。<el-form-item label="业务状态" prop="businessStatus"> <el-cascader ref="casader" clearable key="casader" :options="productList"
2022-05-16 19:22:04
4262
8
原创 iPhone6兼容性问题 单行文字挤压在一起
近期在做一个公众号的项目，遇到了一个样式问题，其他机型均无此问题，唯独iPhone能复现。问题描述：公众号页面iPhone6机型上单行文字重合，挤压在一起，解决办法：display: -webkit-box;
2022-04-11 14:27:56
175
原创 工作中常用的正则表达式
只能数字： /^[0-9]+$/g只能中文、数字、英文：/^[\u4e00-\u9fa5a-zA-Z0-9]*$/只能中文或英文：/^[\u4e00-\u9fa5a-zA-Z]*$/只能中文：/^[\u4e00-\u9fa5]*$/只能英文：/^[A-Za-z]+$/手机号校验：/^[1][3,4,5,6,7,8,9][0-9]{9}$/身份证号校验： /^[1-9]\d{5}(18|19|20)\d{2}((0[1-9])|(1[0-2]))(([0-2][1-9])|10|20|30|31.
2021-12-06 17:24:36
238
原创 解决网页加水印只有第一屏可见的问题
网页加水印，很常见，市面上也成熟，随手拈来，如下：let watermark = {}let setWatermark = (name, width, height) => { let id = '1.23452384164.123412415' if (document.getElementById(id) !== null) { document.body.removeChild(document.getElementById(id)) } let can
2021-07-28 16:56:47
696
原创 前端IE11导出表格 Unhandled promise rejection Error
js导出表格谷歌火狐都是可以，唯独IE报错 Unhandled promise rejection Error分享下解决办法：//下载confirmDownloadHandle() { api.downLoadXml().then(res => { if (window.navigator.msSaveBlob) { // IE浏览器的导出 try { let blobObject = new Blob([res]); wind
2021-07-23 15:55:58
509
原创 报错vue.runtime.esm.js?2b0e:619 [Vue warn]: Error in render: “TypeError: Cannot read property ‘length‘
在用 element-ui 做表单复选框的时候，出现报错 vue.runtime.esm.js?2b0e:619 [Vue warn]: Error in render: "TypeError: Cannot read property ‘length’，如下图所示：代码如下：解决办法就是在form对象里添加checkList字段：如下：export default { data() { return { form: { checkList: [] } } }
2021-07-21 10:45:22
18136
原创 报错 Uncaught SyntaxError: Unexpected token ‘＜‘
前端部署有时候会出现这个报错 ，如下图所示：一般都是配置不当引起的，修改vue.config.js文件// 如果应用被部署在一个子路径上，你就需要用这个选项指定这个子路径。例如，如果你的应用被部署在 https://www.baidu.vip/admin/，则设置 baseUrl 为 /admin/。publicPath: process.env.NODE_ENV === 'production' ? '/' : '/admin/',...
2021-07-21 10:23:59
431
原创 解决echarts图表tooptip被挡住的问题
做echart图表的时候，如果内容过多，tooltip高度不够会导致展示不全，如下图所示解决如下：在echart外层设置 overflow:visible 即可/* 例如我的echart是放在el-card里面的，而我只需设置 */.el-card { overflow: visible;}好了...
2021-07-20 16:59:39
1201
原创 解决echarts滚动条卡住或者不能向右滑动的问题
做echarts图表的时候，如果数据量太大例如横坐标有700条数据，那么势必会用到dataZoom滚动条，我们拖动滚动条快速滑动的时候，有时候滚动条卡住了动不了，或者不能向右滑动，这是因为重叠了解决办法如下：目录：node_modules/zrender/lib/animation/Animator.js文件第64行，加一个判断即可...
2021-07-20 16:44:46
2527
原创 echarts数据更新了图表不更新
echart数据更新了图表不更新做echart图表的时候，如果数据是从接口获取的，那当重新请求接口，数据发生变化的时候echart图表却还是维持原样不更新，这时候有三种方法可解决此问题：<div id="echart" ref="echart"></div>//获取数据后加载获取echart的方法this.$refs["echart"].getChart();getChart() { let option = { ... xAxis： [ data:
2021-07-20 16:23:56
2351
原创 html引入element ui 后，element-icons.woff 和 element-icons.ttf文件找不到
html文件引入element ui后，报错 element.js:1 GET file:///D:/llz/test-8-17/css/fonts/element-icons.woff net::ERR_FILE_NOT_FOUND element-icons.woff 和 element-icons.ttf文件找不到只要在对应文件夹里引入这两个文件即可：点击下载引入：ok了...
2020-08-19 14:52:28
14560
8
原创 TypeError: this.dom.getContext is not a function
Vue引进echarts时报错：解决办法：在初始化echarts的时候，只能使用dom原生方法获取标签，而不能使用 refs 获取把 let dom = this.$refs.charts;改成 let dom = document.getElementById("#chart");
2020-08-03 17:55:54
7841
1
原创 解决页面返回数据空白问题
现象是这样的：有一个h5详情页面，里面有跳转链接。这个页面嵌入了app里面，在app里跳转的时候，跳转出去了再返回，详情页是空的，什么数据都没有解决思路：1、监听onpageshow事件，onpageshow事件在每次加载时触发。如果是从缓存读取的数据，onpageshow对象的event对象的persisted为true，否则为false2、windows对象有一个performance属性，其中的navigation对象的type表示网页的加载来源，有四个值，分别是：（1）0：网页通过点击链接，
2020-07-21 14:56:52
2177
原创 CSS 2行文字时正常显示，超过2行显示更多
在做页面时，ui有一个这样的需求，当描述中不超过2行文字时，则正常显示在页面上，超过2行的时候，显示更多想法是这样的1、不能根据字数的多少判断行数，因为电脑屏幕大小不一样，故一行文字的字数也不同；2、也不能用 -webkit-line-clamp: 2；因为这样“更多”无法显示，被隐藏的文字也无法显示所以，用js搞定是比较好的。下面是实现思路1、首先，假设2行文字的正常高度是40px。在请求描述内容成功之后，去获取描述内容div的高度，如果高度大于40px，则显示更多按钮，并折叠多余内容；2、
2020-06-24 10:19:47
3862
原创 记一次微信分享
只要是h5，都离不开分享，具体过程是怎样的呢？接下来看看流程1、首先，需要微信公众号的appID和appSecret;2、其次，需要把分享页的域名加入白名单，即需要在公众号的安全域名中加上分享页的域名；3、我们分享的这个网站的域名，是一定需要通过备案的，没备案不能分享；此外，自定义分享功能需要通过微信认证才能使用，否则分享的是一串链接而不是自定义的标题和图片；4、通过后端给的获取签名的接口，得到时间戳、nonceStr、signature等字段的内容；5、利用以上内容进行分享下面是具体业务逻辑的
2020-06-24 09:27:56
180
原创 vue动态路由的实现
路由动态渲染，即路由是变动的，由后端返回，故数据不是唯一不变的实现方法：route.index.js需要权限的页面应该放在异步路由里面，登录页、404页等放在同步路由里面，再拼接实现过程// 不需要权限的页面export const asyncRoutes = [ { path: "/", component: Layout, meta: {title: "账号管理", icon: "dashboard"}, redirect: "/accountManger
2020-06-23 19:59:02
1046
原创 zip压缩与解压功能的实现
最近在做一个压缩zip，又解压zip的功能。需求是这样的：如下图所示，1、红色框框里都是需要打包的东西，需要2个zip包，一个android，一个ios，点击两个绿色按钮开始压缩；2、压缩包zip里面解压后是1个大文件夹，大的文件夹里面包含4个文件夹，分别为1个u3d(ios或android)模型文件夹(u3d)、1个背景图文件夹(bg)、1个人物图文件夹(gif)和1个展会切换图文件夹(switchover)，如图二显示；3、bg文件夹和gif文件夹里面的图片是根据蓝色框框中的数量动态改变的,需要全
2020-06-23 18:10:06
488
原创 ueditor百度编辑器不支持保存感叹号？？？
前两天，测试提了一个bug，百度编辑器输入内容 + 感叹号，感叹号保存不了！！！一脸懵逼的我去试了一下，还真有这种诡异的事儿，不止是感叹号，~ + * % 这些符号都保存不了！！如下图所示但是，如果感叹号后面加了问题，感叹号居然可以保存了？？经过调试，发现这些符号的输入都触发不了**_initEditor()**函数，唉 那就不通过双向绑定，自己通过方法去获取输入的内容吧<div> <neditor v-model="data.content" :config="ned
2020-06-23 16:11:38
239
原创 vue更换头像功能，支持编辑区域
简单的更换头像并不是什么难事，难的是更换头像的时候可编辑头像展示区域，如下图所示下面是简单的实现<el-upload class="avatar-uploader" ref="fileUpload" action="" :show-file-list="false" :before-upload="beforeAvatarUpload" :http-request="fileUpload" > <el-ava
2020-06-23 15:36:00
580
原创 阿里云大文件切片上传功能，进度条显示
上传一个二三十兆的视频可能会很快，然而，上传一个八九十兆的视频就没那么快了，甚至会崩掉。因为，只要是上传大文件，必会用到阿里云的分片上传功能，并且显示上传进度<el-upload ref="fileUpload" class="upload-demo" accept=".mp4" :action="''" :on-progress="handleProgeress" :show-file-list="false" :before-upload=
2020-06-23 15:04:31
1269
原创 报错Vue warn: Error in v on handler: object object
业务中使用了promise, 调试代码的时候遇到这个问题，百思不得其解，检查了两三遍，异步编程没错啊，为什么会出现这个错误呢？代码如下：async logout() { await this.$store.dispatch("user/logout"); this.$router.push(`/login?redirect=${this.$route.fullPath}`);}经仔细检查，发现是没有进行错误捕获而导致的正确写法是：async logout() { await t.
2020-06-13 09:08:11
5672
1
原创 h5唤醒app遮罩引导操作
现在有这样的一个功能，app分享到微信的h5链接打开的时候需要唤醒app，但是事实上，在微信打开的链接是无法唤醒app的，所以我们需要引导用户去浏览器打开url，再在浏览器里唤醒app具体是怎样引导的呢？即样式问题。二话不说 ，贴代码<template> <div class="app-share-layer" :class="{lock: showTips}"> <div>页面布局</div> <div @click="onClickOp
2020-06-01 18:28:39
631
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人