- 博客(35)
- 收藏
- 关注
原创 vue3上传excel并在线预览
关于实现excel文档在线预览的做法,一种方式是通过讲文档里的数据处理成html,一种是将文档处理成图片进行预览,这里使用的是第一种。
2024-08-22 14:13:02
401
原创 axios 封装避免重复请求(两种)
在当今的前端开发领域,数据交互是不可或缺的一环。Axios 作为一款基于 Promise 的 HTTP 客户端,因其简洁的 API 和丰富的配置选项,深受广大开发者的喜爱。然而,在实际项目中,我们常常会遇到一个问题:重复发送相同的请求,这不仅会浪费网络资源,还可能导致服务器压力增大。为了提高应用的性能和用户体验,我们需要对 Axios 进行封装,以避免重复请求的问题。本文将详细介绍两种封装 Axios 的方案,帮助您有效地避免重复请求,提升项目质量。
2024-08-13 09:20:06
1303
原创 JavaScript 如何中止Promise
在 JavaScript 中,你可能已经知道如何取消请求:对于 XHR 可以使用,对于 fetch 可以使用 signal。但是你如何取消一个普通的 Promise 呢?目前,JavaScript 的 Promise 本身并不提供取消常规 Promise 的 API。因此,我们接下来要讨论的是如何丢弃 / 忽略 Promise 的结果。
2024-07-12 14:12:44
694
原创 浏览器控制台打印日志的方法汇总
该方法接受两个参数,第一个参数非false的情况下,输入第二个参数的错误内容。该方法会创建一个分组,后续打印的内容会折叠在这个分组内,需要配置。tableColumns(可选)一个数组,元素为需要输出的列表。message(必填)在控制台输出的警告内容,可文本或对象。message(必填)在控制台输出的错误内容,可文本或对象。message(必填)在控制台输出的错误内容,可文本或对象。tableData(必填)需要输出的数据,数组或对象。使用,调用后代表计时结束,输出时长。label(可选)输出时的标签。
2024-07-08 19:00:36
1158
原创 uni-app x 跨平台开发框架
由于uts在Android上被编译为kotlin,它的逻辑层和UI层都是纯原生的,没有通信问题,所以它的性能真正达到了原生水平。在Android平台,uni-app x 的工程被编译为kotlin代码,本质上是换了vue写法的原生kotlin应用,在性能上与原生kotlin一致。如pages.json中配置的导航栏和tabbar功能无法满足你的需求,可以不在pages.json中配置,自己用view做导航栏和tabbar。uvue在App端支持的css语法,是web的子集,类似于但优于nvue的css。
2024-07-05 16:21:27
1480
原创 Flutter 依据JSON数据自动生成实体类
Flutter 依据JSON数据自动生成实体类。如果生成过程中出现报错可能是你已经有了对应的文件,可以选择删除,重新生成,如下图。//清除之前生成的文件,如果直接运行下面的不行。然后在左边输入你的json数据,它会自动生成对应的实体类。会自动生成一个.g.dart的文件。把这个文件放到model里。或者是先清理,然后重新执行。//可以直接运行这个。
2024-05-14 15:15:02
599
原创 Flutter 使用flutter_swiper_null_safety 实现轮播图
【代码】Flutter 使用flutter_swiper_null_safety 实现轮播图。
2024-04-08 08:40:10
501
1
原创 Mac安装oh-my-zsh
终端init的时候并不会执行~/.bash_profile、~/.bashrc等脚本了,这是因为其默认启动执行脚本变为了~/.zshrc。
2024-03-09 16:22:34
945
原创 js跳转网页
2、使用window.location对象的replace()方法:与assign()方法类似,但是replace()方法会替换当前页面的历史记录,而不会创建新的历史记录(不推荐,因为它会丢失当前页面的历史记录)。1、使用window.location对象的assign()方法:可以通过将新的URL作为参数传递给assign()方法来实现页面跳转。3、使用window.location.href属性:可以将新的URL赋值给href属性来实现页面跳转。
2024-03-09 16:03:18
399
原创 Vue3(ts)使用vee-validate表单校验,自定义全局验证规则
在utils目录下新建一个validate.ts文件(这里我使用的是ts,如果用js就创建js文件),内容示例如下:if (!value ||!return '该字段不能为空';});if (!value ||!return '邮箱地址不能为空';if (!return '请输入有效的邮箱地址';});然后在main.ts里引入。
2024-03-01 17:07:12
833
原创 vue2和vue3实现图片懒加载
减轻首页首次加载负担:通过仅加载可视区域内的必要资源,可显著降低页面初始化时的请求数量和数据传输量,从而有效减少服务器压力。提升用户体验:在网络环境不佳的情况下,提前用低分辨率的占位图片替代待加载图片,可以避免页面布局因图片加载过程中的空白或堆叠而显得杂乱无章,提升视觉上的流畅度与舒适度。懒加载的核心在于控制浏览器对图片资源的实际请求时机。通常做法是,先将所有图片元素以统一的占位图填充,并将真实图片地址存储在自定义属性如"data-url"中。
2024-03-01 10:24:28
621
原创 h5判断当前浏览器的环境
我们开发h5的时候经常会遇到各种奇怪的需求,但是很多的时候要判断根据不同浏览实现不同的需求,所以这时我们要针对当前打开的浏览器的环境实现不同的功能,所以今天我们来封装一下判断一下特殊浏览器的方法。
2024-02-27 13:37:55
726
原创 防抖和节流的使用
今天我们来介绍一下javascript中的防抖和节流的使用防抖确保了在事件频繁触发的情况下,只会在最后一次触发之后的一段时间内执行一次。节流则确保了一段时间内只执行一次操作,即便在这段时间内多次触发事件。
2024-02-20 14:02:44
453
1
原创 vue写h5触底翻页
我们先写一个触底执行事件的demo,首先要有一个盒子给他添加一个滚动监听事件。今天让我们来写一个h5的触底翻页加载数据,还是挺简单的。这个是vue2版本,vue3同理。然后我们来写滚动监听的函数。
2024-02-19 14:25:32
558
1
原创 JavaScript获取双中括号里的内容
今天给大家分享一下我踩的一个bug,需求是这样的现在有一个富文本框,要在里面输入一个填空题,填空题大家都知道答案肯定是填空的😂,所以说我们定义的规则是取双中括号里的内容为答案,例如:[[这里是答案]],我们就要把双中括号里的内容取出来传给后端。
2024-01-24 14:41:36
534
1
原创 微信小程序weapp-qrcode生成二维码图片,长按保存和转发
使用weapp-qrcode在微信小程序里生成二维码,但是这个库只能给你生成到画布上,但是我查看微信小程序官方文档发现画布并没有图片的类似于。这个 API可以把画布临时转成图片地址,我们把它显示在页面,然后把画布隐藏起来,这样一来就实现了我们想要的结果。这里我先要找到页面上这个画布,然后将画布通过微信自带的API转换成图片。注意:如果想让image组件长按弹起保存和转发的原生弹窗,要加。这样的属性,所以我们只能通过其他途径把他转成图片。微信小程序官方文档有。,默认值是false。
2024-01-17 15:48:34
1664
2
原创 uniapp 调用wx-open-subscribe实现微信订阅
然后新一个配置文件js,然后引入jweixin-module,然后在配置文件里添加引入wx-open-subscribe。我们在uniapp写h5时,对微信进行一系列的操作需要依赖 “jweixin-module”,所以首先我们要安装这个库。如果你想看有没有引入成功,可以使用微信开发者工具打开,在控制台查看。
2024-01-11 16:18:15
985
3
原创 nuxt3实现301重定向页面
nuxt3实现301重定向页,这个是我的项目目录接着在middleware目录下创建一个default.global.ts文件,这里我项目引入了typescript,如果没有引入就创建一个default.global.js,然后使用nuxt的小伙伴都知道nuxt里本身就有一些默认的约定和规则,所以这个文件会默认为全局的中间件。接着就是实现的代码,其实很简单,就在中间件里请求接口,然后判断是否需要301重定向页面,如果需要则跳转。首先我们要知道像这种对某一类的页面做控制的,最好写在中间件里,这样我们可以统一。
2024-01-09 17:59:31
1045
1
原创 Ant Design Mini 在小程序中的使用
今天来给大家分享一下在原生小程序中或者uniapp中的使用。Ant Design Mini 在小程序中的使用。Ant Design Mini 在原生微信小程序中使用。Ant Design Mini 在 uni-app 中使用。Ant Design Mini 在支付宝小程序中引用。
2023-12-14 15:35:11
1575
1
原创 npm发包命令及流程
如果出现类似于以上错误,说明你的node版本太低了,你需要升级一下你的node版本,建议你安装一个nvm来管理node版本。npm unpublish test@1.0.2 //可以撤销发布自己发布过的某个版本代码。npm unpublish test //撤销已发布的包。要注意package.json里的版本号不能和已发的包的版本号冲突。如果出现以上类似错误说明你的镜像地址不对。到此就可以在npmjs中搜索到你的包啦。如果你是淘宝镜像需要切回镜像。首先查看你的镜像地址。
2023-11-28 10:05:53
434
原创 Vue使用xlsx.js在前端导出Excel表格
Vue使用xlsx.js在前端导出Excel表格,今天给大家分享一下,如何在前端导出Excel表格。
2023-11-21 21:29:27
144
原创 Mac使用nvm安装node报错:no such file or directory: ‘CXX=c++‘
Mac使用nvm安装node报错:no such file or directory: 'CXX=c++'
2023-11-07 21:01:00
281
原创 window.resize监听页面放大缩小不好用
使用 Math.max 取最大字就可以兼容两种情况。这个时候我们可以通过VisualViewport来实现。缩放时,事情很好办,使用 resize 事件即可。但是如果换成 Mac 的触摸板双指缩放就不行了。获取缩放比,键盘缩放,可以使用。经过测试,双指缩放 可以使用。对于用户使用键盘。
2023-11-07 14:50:27
816
原创 如何引入tailwindcss并使用
在自动生成的tailwind.config.js文件中可以自定义样式规则。今天给他大家简单的介绍一下tailwindcss是如何引入到项目,并使用。再将main.css引入到main.js入口文件中。下载和初始化tailwindcss配置文件。使用postcss的话,配置文件如下。这里我以一个Vue项目为例。创建一个main.css。这样子就可以在页面中使用。
2023-10-28 12:30:44
419
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人