- 博客(109)
- 资源 (13)
- 收藏
- 关注
原创 uniapp3 手写签名组件(vue3 语法)封装与应用
本文详细介绍了基于 uniapp3(vue3 语法)封装的手写签名组件。包括父组件的调用方式,如通过条件判断展示签名图片或点击进入签名页面,以及接收签名照片的逻辑。子组件涵盖了自定义导航栏、清除、取消、确认等操作按钮,利用 canvas 实现手写签名功能,包括笔迹绘制、颜色选择、重写、图片旋转与导出等操作,同时涉及获取系统信息设置 canvas 尺寸和背景色等关键技术点,为在 uniapp3 项目中实现手写签名功能提供了完整的解决方案。
2024-12-31 17:47:39
535
原创 uniapp点左上角返回键, 重复来回跳转的问题 解决方案
本文介绍了在使用uni-app框架进行页面跳转时,如何正确处理页面间的导航和返回操作。文章首先展示了如何使用uni.navigateTo方法从页面a跳转到页面b,以及从页面b跳转到页面c。随后,文章重点讨论了在页面c进行提交操作后,如何通过uni.navigateBack方法返回到页面a,而不是直接使用navigateTo或redirectTo进行跳转,以避免出现页面间的无限循环跳转或意外返回到首页的问题。通过这个指南,开发者可以更好地理解和掌握uni-app中的页面跳转逻辑,确保应用的导航流程既流畅稳定。
2024-11-21 14:32:36
585
原创 好用的vscode内置GPT中文版插件 ,可问答 , 可生成代码! (AI程序员 , 出列 !)
ChatMoss 是由 GPT-4 驱动的人工智能助手,支持各种主流模型,3.5 版本全程免费, 4+版本限时免费!
2024-10-25 10:49:19
349
原创 基于vue3封装了一个coverflow轮播图(层叠轮播图)组件
效果如下, 可以适配多张图片 ,小于五张会是平铺展示;大于五张按顺序轮播 , 每次切换有动画。最近公司有这个需求, 但是网上找了一圈 , 没有合适的能用在vue3里面的、且长这样的组件,干脆自己动手写了一个;
2024-10-22 18:11:42
388
原创 js 复制内容到剪贴板, 并且保持格式不变
文章介绍了一种在 JavaScript 中实现复制内容到剪贴板并保持格式不变的方法。通过创建临时的元素,将待复制的文本赋值给它,选中该元素后执行document.execCommand('copy')命令实现复制,最后移除临时元素。
2024-08-23 15:44:50
598
原创 封装了一个Editor富文本框插件,需要npm安装quill
这篇文章展示了一个使用 Vue.js 封装的富文本框插件Editor。该插件基于 Quill 库实现,具有多种功能,包括设置上传文件的 URL 和请求头部、配置工具栏选项、处理图片上传、监听文本变化等事件,并对复制粘贴进行了一定的限制。文章还通过样式部分对富文本框及相关元素的外观进行了调整。
2024-06-22 15:53:38
200
1
原创 HTML5摄像头拍照功能实现:结合Canvas与文件上传,调用结束后关闭浏览器对摄像头的占用
本文详细介绍了如何利用HTML5技术调用系统摄像头,并结合Canvas进行拍照功能的开发。通过具体的代码示例,展示了如何使用`getUserMedia` API获取摄像头视频流,并通过Canvas捕捉图像。文章还涵盖了如何将捕获的图像转换为Base64格式,并进一步转换为文件格式以便上传。此外,还提供了关闭浏览器对摄像头占用的代码,确保应用的安全性和用户体验。适用于需要在Web应用中集成摄像头拍照功能的开发者。
2024-06-22 15:47:20
356
原创 JS通用方法 : 基于文件类型自动选择下载方式 , 文档/图片
本文介绍了一个实用的JavaScript函数loadFile,它能够根据文件的扩展名智能判断文件类型,并选择最合适的下载方法。对于图片文件(如.jpg、.jpeg、.png等),函数会尝试使用fetch和blob技术进行下载,以便更高效地处理大文件。如果遇到错误,或者文件不是图片类型,函数则会回退到传统的创建标签并模拟点击的方式来下载文件。文章还提供了downloadFile和downloadRes两个辅助函数的实现,以及一个isImageByExtension函数,用于检查文件扩展名是否属于图片类型
2023-11-22 13:49:00
573
原创 一个筛选方法, 从一个数组对象里按参数对象遍历筛选出需要的符合条件的数据, 按着参数对象的键去匹配数组对象的键, 值相同即为符合条件,要注意的是需要与参数对象的每一个键值对都符合
从一个数组对象里按参数对象遍历筛选出需要的符合条件的数据, 按着参数对象的键去匹配数组对象的键, 值相同即为符合条件,要注意的是需要与参数对象的每一个键值对都符合
2023-07-10 14:17:23
428
原创 vue3+ts+elementPlus:表单回显数据,无法清空问题,清空表单验证问题
vue3+ts+elementPlus:表单回显数据,无法清空问题,清空表单验证问题
2023-05-08 17:21:12
2328
原创 一个低调、奢华、有内涵且好看的滚动条样式,收藏一下
::-webkit-scrollbar { width: 8px; height: 8px;}::-webkit-scrollbar-track { background-color: transparent; -webkit-border-radius: 2em; -moz-border-radius: 2em; border-radius: 2em;}::-webkit-scrollbar-thumb { background-color: rgb(147, 1
2023-05-06 16:30:28
574
原创 一个很好用的判断是否为空 / null /undefined 等的方法,判空
一个很好用的判断是否为空 / null /undefined 等的方法,如果是 空 / null /undefined 则返回true。
2022-12-30 11:30:25
829
原创 前端项目用hbuilder打包成APP后,调用api开启摄像头进行拍照, 5+app框架
前端项目用hbuilder打包成APP后,调用api开启摄像头进行拍照, 5+app框架
2022-06-21 15:18:54
2344
原创 vue异步请求, 等待处理的回调方法, 解决 拿不到请求rueturn出来的数据 问题
:有的时候我们需要在网络请求结束后,再进行后续动作,例如,在一段网络请求结束后执行跳转,如果不做处理,会有可能出现网络请求未完成的时候页面就已经跳转走不存在了,所以要在调用网络请求的方法中加入一个回调函数,函数里边写请求结束的代码,然后等待网络请求结束后,再去执行这个回调函数.........
2022-06-09 16:14:10
2965
原创 JS实现鼠标拖动 , 不会因为鼠标移动太快, 脱离范围导致停下来
调用该方法即可, 原理是将鼠标移动和松开左键(弹起) 从div转移到window上/** * 鼠标拖动 拖动 * @param id 这里是 querySelector获取 , 因此需要 '#dragBox' ,带选择器 * @returns {{}} */function Drag(id) { //获取元素。 let demo = document.querySelector(id) // '#dragBox' let canMove = false let x = 0,
2022-05-19 19:32:04
2438
原创 css实现气泡对话框
细节自己改一下css 很简单<div id="wrapper"></div>#wrapper { position: relative; width: 800px; height: 800px; border-radius: 12px; background: #ffffff; filter: drop-shadow(0 0 5px rgba(0, 0, 0, .3)); padding: 12px !important; ove
2022-04-15 14:15:51
550
原创 js 获取元素在页面上的绝对位置
getSet(el) { var Box = el.getBoundingClientRect(), doc = el.ownerDocument, body = doc.body, html = doc.documentElement, clientTop = html.clientTop || body.clientTop || 0, clientLeft = html.clientLeft ||
2022-01-17 16:30:36
1458
1
原创 css实现文字无缝横向滚动
<div style="height:20px;font-size:14px;" class="water_tips"> <span class="water_text">公告内容</span></div>.water_tips { width: 100%; line-height: 20px; overflow: hidden; border: 1px solid rgba(255, 255, 255, 0.7);
2022-01-17 15:32:05
2998
1
原创 使用JS获取N个月(前后都可)的日期
2022年1月7日 16:49:37 获取 6个月前 的 日期时间 ;如果传参 为 正数 则是获取 N个月前 的时间如果传参 为 负数 则是获取 N个月后 的时间function getDate(params) { var dt = new Date(); dt.setMonth(dt.getMonth() - Number(params)); return dt.toLocaleString().replace(/\//g, '-') //这里只是把 "/" 替换为 "-"
2022-01-07 16:51:58
1295
2
原创 js 列表自动上下滚动, 开始自顶向下,到底后向上滚动 ,周而复始;
js 实现列表自动上下滚动, 开始自顶向下,到底后向上滚动 ,周而复始;
2021-12-30 20:15:15
2302
2
原创 记录一下elementUI message组件的BUG: 刷新页面, 消息提示空内容
折腾我一早上 , 万万没想到BUG是存在于UI框架!!! 我把好多页面删了,再去看项目居然这个 空的消息提示一直都在, 气哭…Vue.use() 这种写法可能会页面刷新时自动弹出 message,可将下图红框里换成 Vue.component(Message)重点:红圈内两种应用组件的方式...
2021-12-06 11:26:52
388
原创 js快速获取 年月日时分秒 格式的时间
new Date( +new Date() + 8 * 3600 * 1000 ).toJSON().substr(0,19).replace("T"," ")
2021-10-25 15:09:49
482
原创 移动端h5页面监听用户手势滑动
直接整个代码复制丢进去运行;需要加入自己的操作可以在最底下 alert(‘XX’)的地方加 var h = document.documentElement.clientHeight, mybody = document.getElementsByTagName('body')[0]; mybody.style.height = h + 'px'; //返回角度 function GetSlideAngle(d
2021-10-11 15:56:37
4175
原创 vue:使用国际化
简单说,有2个地方:main.js里把new Vue包起来,如下window.vm = new Vue({ // 重点是window.vm = 先将vue挂在window上,在进行第二步 router, i18n, render: h => h(App),}).$mount('#app')需要使用国际化的js文件中,如下使用:window.vm.$t('authentication.failed.message')有用,点赞,嘿嘿嘿.........
2021-09-24 17:58:23
785
原创 JS让页面全屏显示
$('#btn').click(function(params) { requestFullScreen(document.documentElement);})function requestFullScreen(element) { var requestMethod = element.requestFullScreen || //W3C element.webkitRequestFullScreen || //Chrome element.mozRequestFullScreen
2021-09-08 11:07:00
425
原创 纯CSS修改复选框checkbox
效果图:细节的话,自己改,有用点赞下面是css:input[type=radio],input[type=checkbox] { display: inline-block; vertical-align: middle; width: 20px; height: 20px; margin-left: 5px; -webkit-appearance: none; background-color: transparent; border: 0;
2021-08-13 11:18:13
326
原创 vue2: data中的this指向问题
类似这样,此时this指向并不是我想要的,因为我没法this.XXX拿到对应的数据,使用在这个lazyLoad方法中。直接记录一下解决方法,很简单把lazyLoad方法改成箭头函数。this指向就对了。
2021-07-28 17:29:04
1057
原创 web页面的回流,认识与避免
一、什么是回流?回流是会导致页面重新渲染的一些元素,从而影响性能。二、哪些因素会导致回流?1、调整窗口的大小;2、改变字体,如果用rem 设置了根目录的字体大小,这样就减少了回流的次数;3、增加或者移除样式表;4、内容的变化,用户在input中输入了文字(这是不可避免的);5、激活CSS的伪类;6、操作class属性;7、基本操作DOM(包括js中的domcument等);8、计算offsetWidth与offsetHeight 属性,获取元素在窗口中的位置;9、在html代码中直接
2021-07-15 17:01:00
564
转载 前端性能优化小结
前言移动互联网时代,用户对于网页的打开速度要求越来越高。首屏作为直面用户的第一屏,其重要性不言而喻。优化用户体验更是我们前端开发非常需要 focus 的东西之一。从用户的角度而言,当打开一个网页,往往关心的是从输入完网页地址后到最后展现完整页面这个过程需要的时间,这个时间越短,用户体验越好。所以作为网页的开发者,就从输入url到页面渲染呈现这个过程中去提升网页的性能。所以输入URL后发生了什么呢?在浏览器中输入url会经历域名解析、建立TCP连接、发送http请求、资源解析等步骤。http缓存优化是
2021-07-15 16:54:37
996
vue3模板项目, 上手直接yarn或者npm i 直接加载依赖使用即可
2024-10-28
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人