- 博客(36)
- 收藏
- 关注
原创 uniapp分模块开发,uniapp自动生成pages.json
随着公司项目的发展,继承的业务模块也来越来,一个项目的代码也越来越乱。需要把不同的业务单独划分出来,进行独立的开发。
2023-03-13 10:48:51 1068
原创 uniapp App资源差量升级包,uniapp App升级包,uniapp App在线热更新包,uniapp App资源差量升级更新
应用资源安装包(wgt),扩展名为’.wgt’;应用资源差量升级包(wgtu),扩展名为’.wgtu’;系统程序安装包(apk)顾名思义,差量升级包是针对某个历史版本到新版本的差量,所以对于升级服务器来讲需要保留所有历史版本,并且分别生成每个历史版本到新版本的差量升级包。元素名称父元素类型描述必须wgtu根节点appidwgtu属性升级应用的appid是basiswgtu节点基础应用信息是versionbasis属性基础应用的版本信息(旧版本的版本号)
2023-03-02 10:36:08 1031 1
原创 小程序自定义导航栏
小程序自定义导航栏自定义组件navbarnavbar.wxmlnavbar.jsnavbar.wxssapp.js页面引入page.jsonpage.jspage.wxml效果小程序设置回首页,小程序自定导航栏自定义组件navbarnavbar.wxml<!--components/navbar/navbar.wxml--><view class="navbar" style="height:{{navHeight+5}}px;"> <!-- 左上角 返回按钮 和
2022-01-17 17:04:50 488
转载 MutationObserver监听 DOM 结构变化,IntersectionObserver监听元素是否进入了“视口“,图片懒加载,无限滚动,getComputedStyle()读取最终样式
MutationObserver监听 DOM 结构变化,IntersectionObserver监听元素是否进入了"视口",图片懒加载,无限滚动,getComputedStyle()读取最终样式,getBoundingClientRect返回元素的大小及其相对于视口的位置,requestAnimationFrame优化cpu
2021-12-30 16:54:47 1782 1
原创 axios封装,axios结合element封装请求,清除空数据
axios封装,axios结合element封装请求import axios from 'axios'import qs from 'qs'import { Loading, Message} from 'element-ui'const method = ['get', 'post', 'delete', 'put']const request = {}for (let item of method) { request[item] = ({ url, //请求地址 data,
2021-12-29 10:16:08 609
原创 setTimeout,setInterval传递参数,setTimeout,setInterval使用
setTimeout,setInterval传递参数,setTimeout,setInterval使用一、setTimeout,setInterval正常使用setTimeout,setInterval传递参数一、setTimeout,setInterval正常使用// setTimeout匿名函数setTimeout(()=>{ console.log(1)}, 1000)// setInterval匿名函数setInterval(()=>{ console.log(1)},
2021-12-24 11:54:40 368
原创 window.removeEventListener失效问题,removeEventListener不能移除addEventListener解决办法
window.removeEventListener失效问题,removeEventListener不能移除addEventListener解决办法错误代码正确代码错误代码window.addEventListener('scroll', ()=>{ console.log('我在滚动')}, true);window.removeEventListener('scroll')正确代码function fn(){ console.log('我在滚动')}window.addEve
2021-12-22 15:14:15 5477
原创 同一个页面如何使用多个onresize,同一个窗口存在多个resize,vue中多个onresize解决办法
同一个页面如何使用多个onresize,同一个窗口存在多个resize,vue中多个onresize解决办法错误写法正确写法错误写法window.onresize = function(){ console.log('窗口发生变法1')}window.onresize = function(){ console.log('窗口发生变法2')}window.onresize = function(){ console.log('窗口发生变法3')}这样的写法,后面的window.onr
2021-12-22 15:07:19 1436
原创 VUE复制,VUE复制内容到剪贴板,vue-clipboard2,clipboard
VUE复制,VUE复制内容到剪贴板,vue-clipboard2,clipboard安装main.js引入组件代码javascript安装npm install vue-clipboard2 --savemain.js引入import VueClipboard from 'vue-clipboard2'Vue.use(VueClipboard)组件代码<div class="copy"> {{ orderCode}} <el-button typ
2021-12-17 11:36:31 913
原创 element表格重新布局,element表格显示不全,doLayout
element表格重新布局,element表格显示不全,doLayout 问题:解决办法Table 的 doLayout 方法,用于重新计算 Table 的布局问题:1.element table show-summary 合计行不显示问题2.element table显示格式不正确3.element table显示不完整解决办法重新布局tableupdated() { this.$nextTick(() => { this.$refs['table'].doLay
2021-12-07 11:46:47 2013
原创 js获取窗口高宽,js获取文档高宽,js获取屏幕高宽,js获取屏幕分辨率...
js获取窗口高宽,js获取文档高宽,js获取屏幕高宽,js获取屏幕分辨率…网页可见区域宽: document.body.clientWidth网页可见区域高: document.body.clientHeight网页可见区域宽: document.body.offsetWidth (包括边线的宽)网页可见区域高: document.body.offsetHeight (包括边线的高)网页正文全文宽: document.body.scrollWidth网页正文全文高: document.body.
2021-12-07 11:41:20 405
原创 JS监听html内容变化,JS监听html文档高度变化,JS监听html元素的宽高变化
JS监听html内容变化,JS监听html文档高度变化,JS监听html元素的宽高变化代码代码// 添加监听代码let dom = document.querySelector('body')let MutationObserver = window.MutationObserver || window.webkitMutationObserver || window.MozMutationObserver;let mutationObserver = new MutationObserver(f
2021-12-06 17:46:05 1596
原创 element table表头固定悬浮,element table表头黏性布局,element table表头悬浮窗口
element table表头固定悬浮,element table表头黏性布局,element table表头悬浮窗口效果图图一图二图三图四修改方案代码scriptcss效果图图一图二图三图四修改方案在不更改element 组件的东西,也不需要动原来的一行代码,一次写入,整个项目有效代码app.vue加入如下代码,整个项目的table表单都生效,注意使用如果有用请记得点赞scriptmounted() { window.addEventListener( '
2021-12-03 23:22:14 2400 6
原创 在线协同办公,线上execl,纯前端execl,导入导出execl,spreadjs
在线协同办公,线上execl,纯前端execl,导入导出execl,spreadjs实例1实例2实例3spreadjs文档地址实例1在线演示地址实例2在线演示地址实例3在线演示地址spreadjs文档地址spreadjs
2021-11-26 09:44:16 204
原创 echarts饼图,默认选择,自动选中,dispatchAction
echarts饼图,默认选择,自动选中,dispatchAction效果图一、option二、使用步骤1.引入库2.读入数据总结效果图一、option示例:pandas 是基于NumPy 的一种工具,该工具是为了解决数据分析任务而创建的。二、使用步骤1.引入库代码如下(示例):import numpy as npimport pandas as pdimport matplotlib.pyplot as pltimport seaborn as snsimport warnings
2021-11-26 08:56:18 6320
转载 CSS滤镜,高斯模糊,图片融合,图像对比度,blur,contrast
CSS滤镜,高斯模糊,图片融合,图像对比度,blur,contrast说明案例一在线体验馆代码Htmlcss案例二在线体验馆代码Htmlcss说明filter: blur(): 给图像设置高斯模糊效果。filter: contrast(): 调整图像的对比度。案例一在线体验馆代码Html<div class="container"> <div class="filter-mix"></div></div> css.filt
2021-11-18 10:13:21 488
原创 js、关闭或刷新浏览器弹出弹窗
js、关闭或刷新浏览器弹出弹窗H5VUEH5<html> <head> <style> </style> </head> <body> <script lang="typescript/js"> //初始化关闭 window.addEventListener("beforeunload", functi
2021-11-16 17:48:57 2408
原创 echarts自定义label,echarts自定义formatter
echarts自定义label,echarts自定义formatter,echarts样式自定义呈现效果formatter代码option完整代码呈现效果formatter代码formatter: (params)=> { let str = '<div style="padding: 3px 12px;width: 161px;background: #FFFFFF;border: 1px solid #DCDFE6;box-shadow:none; opaci
2021-11-02 11:34:44 6355
原创 nodejs设置跨域,cors
nodejs设置跨域,cors安装引入使用使用须知安装npm install cors --save引入var cors = require("cors");使用**注意:app.use(cors())引入必须放在路由引入之前,否则不起作用**app.use(cors())使用须知注:在cors()方法中可配置对应白名单等,默认是{ "origin": "*", "methods": "GET,HEAD,PUT,PATCH,POST,DELETE", "prefli
2021-11-01 10:30:32 1106
原创 前端下载文件,js下载文件,axios使用post下载文件,post下载文件,流文件下载,下载文件
前端下载文件,js下载文件,post下载文件,流文件下载,下载文件普通下载一、流文件下载自定义文件名普通下载在H5中,a标签新增了download 属性,包含该属性的链接被点击时,浏览器会以下载文件方式下载 href 属性上的链接。 <a href="http://aa.xlsx" download="http://aa.xlsx">下载</a>// 或者封装function download(href, title) { const a = document.c
2021-10-25 17:48:13 278
原创 常用正则表达式
常用正则常用正则常用正则正则说明整数^-?[1-9]\d*$正整数^[1-9]\d*$负整数^-[1-9]\d*$数字^[+-]?\d*.?\d+$浮点数^[+-]?\d*\.\d+$正浮点数^[1-9]\d*.\d*负浮点数^-([1-9]\d*.\d*邮箱地址^[A-Za-z0-9]+((.|@)[A-Za-z0-9]+)*.[A-Za-z0-9]+$颜色值匹配[a-fA-F0-9]{6}$url匹配
2021-10-25 15:34:10 150
转载 History 对象,history添加和修改浏览历史记录,history.pushState()和history.replaceState()
History 对象,history添加和修改浏览历史记录,history.pushState()和history.replaceState()概述属性方法History.back()History.forward()History.go()History.pushState()History.replaceState()popstate 事件概述window.history属性指向 History 对象,它表示当前窗口的浏览历史。History 对象保存了当前窗口访问过的所有页面网址。下面代码表示当
2021-10-15 11:14:12 5182
转载 前端监控,数据采集与上报
前端监控,数据采集与上报数据采集性能数据采集FPFCPLCPCLSDOMContentLoaded、load 事件首屏渲染时间监听 DOM判断是否在首屏使用 requestAnimationFrame() 获取 DOM 绘制时间和首屏内的所有图片加载时间作对比优化接口请求耗时资源加载时间、缓存命中率判断该资源是否命中缓存浏览器往返缓存 BFC(back/forward cache)FPSVue 路由变更渲染时间错误数据采集资源加载错误js 错误promise 错误sourcemapVue 错误行为数据采集P
2021-10-14 15:50:17 1465
原创 判断元素是否在当前屏幕内,获取当前元素的高宽,x,y,top,bottom
判断元素是否在当前屏幕内const viewportWidth = window.innerWidthconst viewportHeight = window.innerHeight// dom 对象是否在屏幕内function isInScreen(dom) { const rectInfo = dom.getBoundingClientRect() if (rectInfo.left < viewportWidth && rectInfo.top <
2021-10-14 11:25:49 210
原创 vue在线浏览pdf,计算pdf页码总数,vue-pdf
vue在线浏览pdf,vue-pdf安装使用组件中加入script效果安装npm install --save vue-pdf使用组件中加入 <div> <pdf ref="pdf" :src="url" :page="1" ><!--page当前显示页数--> </pdf> </div>scriptimport pdf from 'vu
2021-10-12 16:04:57 996
原创 vue使用jointJs,vue流程图、旅程图
vue使用jointJs,vue流程图、旅程图效果图安装使用组件中加入script创建画版实例化画布,把画布挂载到dom添加元素自定义元素事件交互效果图安装npm install --save jointjs使用// 引入jointjs和jointjs样式import 'jointjs/dist/joint.css'import * as joint from 'jointjs';组件中加入<div ref="myholder" id="paper" @drop="
2021-10-08 18:15:28 2119
转载 VUE 生成带Logo 的二维码
安装npm install --save vue_qrcodes使用在组件中加入<qrcode :url="data.url" :iconurl="data.icon" :wid="200" :hei="200" :imgwid="53" :imghei="53"></qrcode>scriptexport default { name
2021-10-08 16:11:01 499
原创 (vue-treeselect)vue下拉选择树
(vue-treeselect)vue下拉选择树安装使用在组件中加入script呈现效果点击前点击后安装npm install --save @riophae/vue-treeselect使用在组件中加入<treeselect v-model="value" placeholder="请选择" :options="data"/>scriptexport default { components: { Treeselect }, data() {
2021-10-08 15:58:17 266
转载 js下载table表为Excel
js下载table表为Exceljs代码HTML页面导出Exceljs代码<script src="./js/jquery.table2excel.js"></script> <script> $('#btn').click(function () { $("#print").table2excel({ //这里要选择table标签 我这里是用id选择 也可$('table').table2excel()
2021-09-30 15:51:45 730
原创 nodejs把body的数据解析出来,如何使用http-proxy-middleware做转发
nodejs把body的数据解析出来,如何使用http-proxy-middleware做转发实现需求错误代码修正后的代码实现需求由于最近上线的活动经常被撸羊毛,需要在客户端添加签名,node端进行验证,加签的方式是对接口发送的参数进行加密,node端进行解密验证。get 请求的时候没什么问题,但是 post 请求会报 ECONNRESET 错误错误代码const proxyMiddleware = require('http-proxy-middleware');app.use(bodyPars
2021-09-30 15:18:26 883 1
原创 js 下载base64,File,Blob,ArrayBuffer格式文件
js 下载base64,File,Blob,ArrayBuffer格式文件file对象转base64base64 转 filebase64 转成blob 上传blob 转 base64blob 转成ArrayBufferbuffer 转成blob下载file对象转base64let reader = new FileReader(); reader.readAsDataURL(file[0]) console.log(reader)base64 转 fileconst base64Conver
2021-09-29 18:40:23 742
原创 vue实现图片上传剪切、预览、缩放、旋转
vue实现图片上传剪切、预览、缩放、旋转安装使用安装npm install vue-cropper -s使用main.js中添加import VueCropper from 'vue-cropper'Vue.use(VueCropper)在组件中加入<!-- element 上传图片按钮 --> <el-upload class="avatar-uploader" action="https://jsonplaceholder.typ
2021-09-29 18:06:18 2083
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人