自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(23)
  • 问答 (3)
  • 收藏
  • 关注

原创 手写一个Promise.all函数

【代码】手写一个Promise.all函数。

2024-04-21 17:56:07 69

原创 Uniapp开发App离线资源查看实现(兼容安卓、ios)

查看具体某个文件时,需要检查当前是 IOS 还是安卓,IOS 使用 html5Plus 进行解压,安卓系统需要使用 zip4j(需要到插件市场安装) 进行解压,获取到解压后路径直接打开即可。调用 uni.downloadFile 获取文件临时存放路径,再用 uni.saveFile 保存文件到本地,拿到文件存放的本地路径。业务场景:对于多种资源类型(图片、视频、scrom、office等)需要在离线状态下,通过移动端缓存可查看资源。3、查看资源时通过缓存找到相应的本地路径,通过解压获取到相对应的资源。

2024-04-21 15:42:24 291 2

原创 Next.js(五)中间件

使用 Middleware 的时候还要注意一点,那就是目前 Middleware 只支持 Edge runtime,并不支持 Node.js runtime。/about/:path* 匹配 /about、/about/xxx、/about/xxx/xxx。/about/:path+ 匹配 /about/xxx、/about/xxx/xxx。/(about|settings) 匹配 /about 和 /settings。匹配 /about、/about/xxx。

2024-04-20 21:02:50 246

原创 webpack3项目启动优化

项目太大了,启动速度很慢,可以配置 HardSourceWebpackPlugin ,通过缓存第一次启动的内容,接下来的速度大幅提升。

2024-04-13 01:12:52 152

原创 Next.js(四)定义路由程序

这里有个知识点,不用revalidate/next.revalidate,在开发模式下使用 fetch,也会被缓存,因为 next.js 拓展了原生的 fetch 方法。该文件需要放在 app 文件夹下,但不能与 page.js 统计,因为请求接口也是用文件路径,不用加上route.js,会与 page.js 起冲突。10s 后,比如 12s 刷新,不会马上更新树枝,而是触发更新,然后,比如 13s 再请求,才会更新数据。Next.js 中的路由程序,实际上就是 API 接口。

2024-04-11 00:30:31 267

原创 一道大厂面试题讲透JS事件循环输出

4)接下来执行了async(),可以看到这里用到的async/await,await之前的“async1 start”正常输出,但由于await引起的阻塞,会转入async2()执行,输出“async2”,await后的输出全部推进微任务的队列里;8)微任务队列清空后,接着执行宏任务队列,输出“setTImeout0”,执行完一个宏任务后,找到之前的“setImmediate”输出,接着执行下一个宏任务“setTimeout3”事件循环输出的题目是笔试常考了,掌握几种情况下的推导思路,其实不算困难。

2024-04-07 23:24:39 160

原创 实现缓存已经请求过的数据

【代码】实现缓存已经请求过的数据。

2024-04-07 09:37:46 71

原创 Next.js(三)导航与路由

拦截路由的意义,简单的来说,就是希望用户继续停留在重要的页面上。与[...folderName]不同的是,不带参数的路由也会被匹配到,及可以匹配/dashboard,前提是没有映射的文件路径/dashboard/page.js,如果存在此路径,使用[[...folderName]]就会报错。拦截路由感觉上就是页面上的交互都是用“假的”路由下的页面的内容,即 app/(.)photo/[id]/page.js ,只有复制地址到地址栏打开才是真正的页面,即 app/photo/[id]/page.js。

2024-04-06 22:49:00 980

原创 数组函数map和flatmap的区别

2024-04-06 21:08:53 104

原创 margin和padding值为百分比%时是相对宽度计算得来的

根据W3C规范:

2024-04-06 20:48:28 71

原创 Next.js(二)App Router的使用

原理:loading 用 <Suspense> 把 page 和 promise 包裹住,当Suspense 捕获到 promise(可以用aysnc 和 use函数获取(React的use函数,用于读取promise或者context的值)) 返回的数据时,关闭 fallback。(2)App架构新增了布局(layout)、模版(template)、加载状态(loading)、错误处理(error)、404(not-found)等文件,为项目开发提供了一套规范。根布局:app文件夹下的布局。

2024-04-06 08:37:58 560

原创 Next.js(一)创建一个Next.js项目

Next.js 的项目架构有两种方式:App Router 和 Pages Router。这里我们采用 App Router 来搭建项目,首先创建 app 文件夹,再在文件夹下创建 layout.js 文件和 page.js 文件。使用 npm next build --profile 可以开启 React 的生产性能分析,然后输入 npm run start ,就可以在 Profiler 中监测性能。(Next.js 同样支持 .ts、.tsx、.jsx)一、创建 Next.js 项目。

2024-04-06 04:53:16 438

原创 小程序多文件上传

解决方案:通过获取到临时上传文件路径通过循环forEach调用uploadFile,因为uploadFile的path只能是String类型的。

2024-04-02 09:44:21 65

原创 手写Array.prototype.reduce

【代码】手写Array.prototype.reduce。

2024-04-02 01:35:46 61

原创 手写一个transfrom函数

【代码】手写一个transfrom函数。

2024-04-01 07:54:44 92

原创 手写一个深拷贝

【代码】手写一个深拷贝。

2024-04-01 06:47:54 83

原创 懒加载下el-cascader级联选择器实现回显

ElementUI中级联选择器如果是懒加载模式下,单纯赋值级联的数组是没办法回显的,因为无法获取下一级的数据。记录一下遇到此场景的一种解决方案。

2024-03-15 00:10:33 511

原创 实现Watcher类

实现方式主要是通过建立Dep类和Watcher类,通过实例化Dep类对象分别对每个监听的变量的回调方法进行收集,从而在setter方法(即改变值时调用Dep实例对象),调用各自watcher的回调函数。因为是在实例化对象时就定义好的,说明实例化时就已经完成了watch的收集,需要在Vue类中直接定义并调用initWatch。Watcher类其实就是观察者,如果某个变量被定义了监听方法时,就会去new一个Watcher。显然,$watch方法是挂载在Vue的实例对象vm上的,所以需要在Vue类中进行定义。

2023-04-09 23:19:25 90

原创 实现数据劫持

【代码】实现数据劫持。

2023-04-06 23:51:40 60

原创 Object.defineProperty的使用和介绍

configurable:是否可以删除目标属性或者是否可以再次修改属性的特性(writable,configurable,enumerable)。设置为 false 不能被删除或不可以重新设置特性。设置为false,不能被枚举。writable:是否可以被重写,true可以重写,false不可以重写,默认为false。getter:当访问该属性时,该方法就会被执行。setter:当属性值修改时,该方法就会被执行。: 被定义的属性的值,默认为undefined。prop: 必需,需定义或者修改的属性的名字。

2023-04-05 23:05:16 93

原创 JQuery实现放大镜

<!DOCTYPEhtml><htmllang="en"><head><metacharset="UTF-8"><metaname="viewport"content="width=device-width,initial-scale=1.0"><title>Docume...

2020-02-13 15:32:05 469 1

原创 9.11课堂遗留问题

问:当子类继承父类后,子类中的方法,在父类中进行重载,那么在运行时是调用子类中的该方法还是父类中的该方法?例子:public class LessonProblem {        void test(int x) {        System.out.println("01 " +x);    }        public static void main(String...

2018-09-11 15:35:31 164

原创 Linux环境下curl未安装和升级

现象:无法使用curl传输命令,显示“Command not found”puTTY下:Finalshell下:原因:新下载的puTTY和Finalshell都没有安装curl解决方法:输入指令:apt-get install curl -y &amp;&amp; yum install curl –y 和...

2018-08-15 04:38:39 2739 1

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除