- 博客(87)
- 资源 (8)
- 收藏
- 关注
RSS订阅
原创 aui移动端UI框架
aui 是一套基于原生javascript开发的移动端UI框架。包含常用js API(如：字符校验、本地定时存储、数组对象处理、ajax原生封装、设备信息获取、手势事件…)；插件(如：loading加载、dialog模态框、toast消息提示、picker多级联动…)；UI组件(如：button按钮、tag标签、card卡片…)；常用模板(如：侧滑菜单、加入购物车动画、星级评价、图片上传预览裁剪、选项卡…)。
2020-05-14 09:57:33
10723
1
原创 three.js3维坐标系+绘制立方体(带边框)
1、three.js绘制3维坐标系；2、绘制多个立方体；3、立方体设置边框；4、立方体表面绘制线条；
2022-02-28 14:14:19
1283
原创 canvas绘制立方体盒子
基于canvas绘制立方体length: 长width: 宽height: 高id: canvas元素idcolor: 盒子颜色// 基于canvas生成立方体export function generateCubeByCanvas(length = 0, width = 0, height = 0, id = '', color) { const canvas = document.getElementById(id) const ctx = canvas.getConte
2022-02-07 17:58:46
1037
原创 html2Canvas+JsPDF生成pdf文件并下载
采用html2Canvas+JsPDF实现web页面/dom元素转pdf文件并下载1、安装html2Canvas:npm install html2canvas2、安装JsPDF：npm install jspdf/** * 生成PDF格式文件并下载 * @param {*} el 页面元素名 * @param {*} title 文件名称 * @returns */export function generatePdf(el, { title = '' }) { retur
2022-01-06 10:07:57
1396
1
原创 js数字位数不够前面补零
/** * 数字不够x位，前面补0 * @param {*} num 数字 * @param {*} len 补零长度 * @returns 0001 */export function formatZero(num, len) { if (String(num).length > len) { return num; } return (Array(len).join(0) + num).slice(-len)}...
2022-01-06 10:01:03
4063
原创 Vue项目图片压缩
引用：import { compressImage } from './compress'...// 校验大小数量var file = document.querySelector('input').files[0]if(this.fileList.length >= 3){ Message.success({ content: `最多可上传3张` }) return}if(file.size >= 1024 * 1024 * 2){ Message..
2021-09-16 10:19:15
2613
原创 Vue项目引用高德地图实现车辆轨迹回放
Vue项目引用高德地图实现车辆轨迹回放一、引入高德地图jsApi在项目入口index.html页面以cdn方式引入 <script src="https://webapi.amap.com/maps?v=1.4.15&key=1bccd008f8fec2fdd171c1a3ce3b0ba9&plugin=AMap.DistrictSearch" ignore></script>二、封装高德公共库在项目下新建公共库js文件,代码如下：export
2021-08-16 11:59:31
1546
原创 Powershell如何查询目录所有文件和文件夹的名称
Powershell如何查询目录所有文件和文件夹的名称 // 获取文件名称、修改时间等 Get-ChildItem // -Name设置可仅获取文件名称 Get-ChildItem -Name输入 Get-ChildItem 如图：输入 Get-ChildItem -Name 如图：
2021-08-02 16:30:09
4285
原创 js获取当前页面url网址信息
js获取当前页面url网址信息 var url; url = window.location.href; /* 获取完整URL */ alert(url); /* http://127.0.0.1:8020/Test/index.html#test?name=test */ url = window.location.pathname; /* 获取文件路径（文件地址） */ alert(url); /* /Test/index.html */ url = window.location.
2021-05-26 09:33:44
476
原创 Vue项目分页组件封装
解决单页面存在多个分页的情况调用 <cview-paginator size="5" total="20" currentPage="1" @on-change="changePage($event, 1)" > </cview-paginator> <script> import CiewPaginator from '@/component/paginator.vue' export default { .
2021-05-15 11:50:10
275
原创 js设置页面body滚动条是否显示
js设置页面body滚动条是否显示// 判断是否存在滚动条let hasScrollbar = () => { return document.body.scrollHeight > (window.innerHeight || document.documentElement.clientHeight)}// 获取滚动条宽度let getScrollbarWidth = () => { let scrollDiv = document.createElement
2021-05-15 11:37:04
565
原创 js获取滚动条宽度
js获取滚动条宽度getScrollbarWidth() { let scrollDiv = document.createElement('div'); scrollDiv.style.cssText = 'width: 99px; height: 99px; overflow: scroll; position: absolute; top: -9999px;' document.body.appendChild(scrollDiv) let scrollbarWidt
2021-05-15 11:30:35
2824
原创 js 判断页面是否存在滚动条
js 判断页面是否存在滚动条hasScrollbar() { return document.body.scrollHeight > (window.innerHeight || document.documentElement.clientHeight)}
2021-05-15 11:28:48
3499
1
原创 canvas环形进度条
利用canvas绘制环形进度条组件对canvas绘制模糊问题进行了处理。根据dpr，扩大canvas画布的像素，使1个canvas像素和1个物理像素相由于画布扩大，canvas的坐标系也跟着扩大，如果按照原先的坐标系绘图内容会缩小所以需要将绘制比例放大使用progressRing({ el: document.getElementById("canvas"), //绘制对象 width: 130, height: 130, lineWidth: 6, lineCap: 'rou
2021-04-29 16:56:32
419
原创 vue项目封装腾讯TcPlayer播放器
vue项目封装腾讯TcPlayer播放器实现vue组件化项目播放m3u8格式流媒体直播/点播；解决TcPlayer播放器跨域问题（将TcPlayer-2.3.3.js文件代码下载到项目本地，TcPlayer-2.3.3.js文件内部引入的外部资源也以相同方式本地引入）引入播放器<templant> <cview-player ref="cviewPlayer" @on-close="destroy" /></templant><script>
2021-04-29 11:32:18
2273
2
原创 js 将字符串转为每N个为一组的数组
let str = '字符串截取为每3个一组数组测试' createArr(str, 0, 3, 3) /* @params str{ String} 要截取的字符串 @params start { Number } 首次截取的开始索引，每次截取后递增 @params end { Number } 首次截取的结束索引，每次截取后递增 @params unit { Number } 每一组个数 */ // 将字符串转换成unit个字符为一组的数组 const c.
2021-04-28 11:46:23
1559
1
原创 js 将一维对象数组转二维数组
js 将一维对象数组分割重组为每X组为一组的二维数组var Arry = [ {id： '1', name: 'A'}, {id： '2', name: 'B'}, {id： '3', name: 'C'}, {id： '4', name: 'D'}]var arr= [];for(var i = 0; i < Arry.length; i += 3) { arr.push(Arry.slice(i, i + 3));}console.log(arr)...
2021-03-25 11:04:41
1723
原创 js雪花飘落特效
js雪花飘落特效调用：new Snows({ warp: '.aui-content', el: '<i class="iconfont iconxuehua snow"></i>', num: 100, windowWidth: document.querySelector('.aui-content').offsetWidth, windowHeight: document.querySelector('.aui-content').offsetHeight})
2021-01-06 16:42:29
324
原创 js计算对象数组中某个属性合计
js 计算对象数组中某个属性合计countTotal调用示例：let arr = [ {id: 0, price: 199.88}, {id: 1, price: 299.88}, {id: 2, price: 399.88}];console.log(countTotal(arr, price)); //899.64//计算对象数组中某个属性合计function countTotal(arr, keyName) { let $total = 0; $total = arr.redu
2020-12-25 09:59:46
8841
原创 js 金额转中文大写格式
js 数字金额转中文大写格式moneyToChinese调用示例： moneyToChinese('199.99'); //console：壹佰玖拾玖元玖角玖分 function moneyToChinese(money) { let cnNums = new Array('零', '壹', '贰', '叁', '肆', '伍', '陆', '柒', '捌', '玖'); //汉字的数字 let cnIntRadice = new Array('', '拾', '佰', '仟');
2020-12-25 09:44:52
699
1
原创 js实现长按显示全部内容
js实现文字超出省略号显示时长按显示全部元素内容超出省略号显示时长按该元素，生成toast弹窗(id:toolkitContainer)，以显示全部内容#toolkitContainer { max-width: 150px; position: absolute; z-index: 999; background-color: #f6f6f6; border-radius: 5px; color: #000; padding: 5px 15px; border: sol
2020-11-27 10:00:13
529
原创 谷歌浏览器安装vue-devtools扩展插件
谷歌浏览器安装vue-devtools扩展插件介绍：新版vue-devtools下载下来由于缺少shells文件夹，导致安装始终无法成功。本文提供Git仓库地址，可下载vue-devtools5.1版本，内部包含shells文件夹，打开shells文件，选择chrome文件夹，拖动到谷歌浏览器扩展插件添加页面即可。下载：打开git仓库下载步骤：效果：...
2020-10-14 09:59:27
705
原创 Vue组件化项目底部tabbar导航组件
Vue组件化项目底部tabbar导航组件组件效果：aui-footer.vue组件代码：<template name="aui-footer"> <div class="aui-footer row-before"> <div class="aui-footer-item" v-for="(item, index) in items" :key="index" :class="{'active': currentIndex==index}" @click.stop
2020-07-17 17:51:06
361
1
原创 微信公众号项目录音上传功能
微信公众号项目wx.startRecord录音本文包含以下功能：1、开始录音2、结束录音3、上传录音4、开始播放录音5、结束播放录音开始录音：var alltime = 60; //总时长var r_flag = true; //录音开关 var r_time = 0; //录音当前时长var localId , START, END ;function startRecord() { localId = ''; wx.startRecord({ success:
2020-07-17 17:17:16
1913
web前端常用chrome谷歌浏览器扩展插件
2022-02-07
高德地图绘制汽车/服务站标记.zip
2021-04-27
aui移动端UI框架
2020-05-14
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人