- 博客(27)
- 收藏
- 关注
RSS订阅原创 元素设置了sticky粘性布局后，关于滚动后怎么样让这个元素自动添加阴影，我用自定义指令实现
在写h5或者pc站的时候，顶部总会固定一些东西。然后我们会设置顶部的容器为粘性布局固定在顶部。但滚动之后会很僵硬。例如下面这样：我们看看element的表格的效果：再来看看最后我们实现的效果：其实网上也有纯css实现的方案，大概意思就是两个伪元素，底下是阴影，上面是一个空白，滚动的时候空白格移除就显示出了阴影。但我懒得写，突发奇想写了一个自定义指定来实现。其实实现原理很简单，思路大家都知道，无非就是监听滚动添加样式。
2024-08-14 17:56:53
639
原创 vue3进阶用法之通过调用函数动态加载组件用法及示例
vue官方文档那边虽然说了函数的使用方法，但没有列举这种业务场景。这里只是做一个简单的实例，其实可以通过这种方法实现其他更多的功能，比如说modal框等等等。
2024-08-14 15:45:18
1266
原创 关于华为应用市场上架需要同步告知使用权限的解决方案（uniapp适用，原生开发思路同理），直接复制粘贴！
华为莫名其妙来了一套连体拳，打工人何苦为难打工人！！
2023-12-25 16:10:26
10328
26
原创 uniapp开发的app上架审核的坑，分享出来让大家少走弯路
uniapp开发完应用之后，每次都忘了有什么坑，每次都要走一遍弯路，特此记录，持续更新…
2023-10-10 14:30:57
2721
原创 简单的几行代码封装一个文字入场动画组件，复制即可
由于自己很喜欢ant motion的文字动画，vue里又找不到合适的封装好的，所以找到了几个参考的简单的封装了一个组件，适用于各种标题的文字入场动画，复制即用。
2023-08-17 15:06:46
257
原创 Monorepo + pnpm实现多项目管理，抽出公共模块，用最少的话，带你快速入门！
在开发中，我们如何进行多项目管理，多个项目之间有同样的依赖你又该怎么去管理？在目前很多开源库，都使用了Monorepo+pnpm的技术来实现管理依赖、版本、配置等，也可以提高代码的复用性和协作效率。比如说你想写一个组件库，组件库需要文档，你的文档项目中想引入你的组件库并展示，那么这时候就会用到Monorepo和pnpm了，这时候会在你的组件库文档项目中，链接你的组件库，就可以直接引用了。那么，接下来我们进入正题！
2023-08-10 17:16:54
3257
原创 简单分享一下对于后端返回的状态码，我认为的最优雅的封装方案
首先，我们需要定义一个接口，表示选项对象。一个选项对象包含三个属性：label（标签），value（值），style（样式）。// 定义一个接口，表示选项对象 interface IOptionItem < T > {value : T;style?复制注意，我们用了一个泛型参数T来表示value的类型，这样我们就可以让这个接口支持不同类型的值，比如数字、字符串、布尔值等。接下来，我们需要定义一个泛型类，表示选项列表。
2023-08-04 23:28:28
388
原创 前端开发中常用的设计模式及运用
在前端开发中，代码谁都会写，有时候你可能知道这么写，但是你不知道为什么这么写及这么写的意义是什么。今天有摸鱼事件，来补补设计模式相关的知识点，让自己更深刻地认知设计模式并记录分享出来，让自己的开发思路更清晰。免得以后面试官问：“你知道设计模式吗？用过哪些设计模式？”，我：“我会写但我说不出来”，面试官：“回去等通知吧”合理的利用设计模式能提高我们代码的可读性，也能让我们的开发思路更清晰，所以好好吃透这些设计模式，对我们自身是有极大好处的。
2023-07-24 13:54:49
349
原创 关于自动化部署两个项目合并一个项目的解决方案
事情是这样的，浙政钉上架，现在需要前后端共用一个项目进行自动化部署。一个手机端的项目，一个后台web的项目。简单来说就是：只执行一次npm run install && npm run build需要打包两个两个项目并且共用一个入口文件。我当时脑子里在想：“？？？？？？？？？这怎么搞？？？虽然这个需求很xxxx，但是也让我从中学习了很多东西，对微前端和script命令了解更深。最后发现，可以曲线救国，当时开心了很久。
2023-07-18 11:50:17
1630
原创 解决flex gap兼容性问题
一个项目写下来，在网页端预览的时候正常，结果到产品经理手上。设计稿样式实际产品手机上样式产品：“你这玩意儿怎么没间距？我：“为什么我的正常？？？呐呐呐你看我手机（来自RedmeK50Utral）”产品：“哦，你看我的手机（来自荣耀20）”我：“。。。至此我看了看我代码中的一堆gap，再看了看她那还不退休的老安卓，陷入了沉思！以上就达到了gap同样的效果，并且保持了良好的兼容性。妈妈再也不怕兼容性不好的手机用不了gap啦！总之不管用的什么打包工具，vite也要webpack也好，原理是一样的。
2023-05-05 13:29:58
9458
原创 在vue中使用unocss及基本使用方法
unocss是一个即时的原子CSS引擎，它可以让你用简短的类名来控制元素的样式，而不需要写复杂的CSS代码。unocss刚上手可能有点不习惯，写多了再加上unocss的插件有语法智能提示，能使我们工作效率大大提高，接下来就是unocss熟练度的问题了。加油，看这篇文章的陌生人。
2023-04-17 14:32:25
9691
2
原创 flex:1详解，以及flex:1和flex:auto的区别
在工作中，我们经常会用到flex：1这个属性，来使我们flex中的元素自适应宽度，但在这之前，我并没有详细了解过flex：1这个属性具体代表什么，特此写一篇博客分享一下学习到的知识。这里的flex:1相当于flex: 1 1 0%，它是一个简写属性，表示项目（flex item）在弹性容器（flex container）中如何伸缩。flex-grow 定义项目的放大比例，默认为0，即如果存在剩余空间，也不放大。
2023-04-17 10:53:04
5516
3
原创 解决uniapp vue3版本，cli脚手架项目编译到app平台后，模板中rpx不生效，但是在css中写rpx生效bug
项目场景：uniapp vue3版本，cli脚手架项目编译到app平台后，模板中rpx不生效，但是在css中写rpx生效bug。
2023-04-13 10:41:25
1252
原创 聊聊packege.json和最常见的scripts字段
日常开发中，现在的前端开发已经被三大框架取代，其中最主流的不过vue和react，而开发这些项目的时候不得不接触packege.json这个文件，可你真的了解这个文件吗？packege.json文件是一个JSON格式的文件，它包含了Node.js项目的元数据和依赖信息。它是Node.js系统的核心，也是npm的配置文件。有了packege.json文件，你可以方便地管理和安装你的项目需要的外部模块，以及定义一些可以在命令行中运行的脚本。
2023-04-06 21:43:06
639
原创 知道Object.keys，那你知道Object.entries吗？
JavaScript中的对象是一种无序的键值对集合，它可以用来存储和操作各种数据。有时候，我们需要遍历对象的键和值，进行一些操作或者输出。本文将介绍四种遍历对象的键和值的方法，以及它们的优缺点。
2023-04-02 22:59:39
301
原创 js是单线程的，如何实现多线程？一份WebWorker食用指南附上
js是单线程的，如何实现多线程？”当这句话从面试官口中说出来的时候，怎么去回答，才疏学浅的我，好奇心就一下被勾起来了。甚至脑中已经yy到了我与面试官对峙的场景：面试官：“js是单线程的，如何实现多线程？我：“咱就是说************ ,你 ************吧”（此处省略一万字…）以上开玩笑，接下来进入正题。
2023-03-16 14:04:04
1359
2
原创 Composition Api 和 Options Api的区别在哪？哪个好？为什么我选择用vue3的组合式api，而不是选项式api？
看看官方文档的说明组合式 API (Composition API) 是一系列 API 的集合，使我们可以使用函数而不是声明选项的方式书写 Vue 组件。响应式 API：例如ref()和reactive()，使我们可以直接创建响应式状态、计算属性和侦听器。生命周期钩子：例如和，使我们可以在组件各个生命周期阶段添加逻辑。依赖注入：例如provide()和inject()，使我们可以在使用响应式 API 时，利用 Vue 的依赖注入系统。再看看官方给出的一张图以及说明。
2023-03-11 18:13:57
2096
2
原创 前端统一团队编码风格之Prettier及配置方法
每个人都需要把默认格式化工具设置为Prettier，这样才能保持统一的编码风格，然后commit 并且 push 你的代码吧，让你的同事拉下来Prettier可以在vscode中的setting.json中配置，好处就是不用每个项目都放一个.prettierrc.js文件，但同事之间的编码风格就会不统一，建议还是每个项目都放一个，麻烦是麻烦了点，但协作起来再也不用怕同事把你的代码格式化了。
2023-03-10 11:43:26
857
1
原创 细说前端打包发布后，浏览器缓存如何清理？其实只需要简单的webpack配置就行
由此可见，没配置过的webpack输出文件名，每次打包产生的文件是一样的，所以浏览器缓存以为还是之前的js文件，就直接从缓存获取，在项目中配置webpack打包输出文件名还是很有必要的，是杜绝发布后存在的缓存问题的最有效方式，vite的配置。
2023-03-07 10:28:13
8253
10
原创 vscode不支持nvue语法高亮的解决办法
项目场景：用vscode开发uniapp会遇到用.nvue开发的时候。但是vscode并没有提供.nvue的语法高亮，这篇文章给刚用vscode写.nvue的读者。
2023-02-24 10:29:35
1732
4
原创 Vue3一行代码写完列表请求和分页状态控制？增加你摸鱼时间以及准点下班的技巧
写过小程序或者h5等移动端的都知道，请求后台列表接口都会有分页小声比比:你服务器压力小了，我特么代码量增加了，每个页面都需要去定义当前列表的状态（是否有下一页），当前列表是第几页，还需要累增，以及列表的每页请求多少条！我就是一个臭敲代码的啊，我只想早点下班！！特别是一个页面请求好几个列表的写这些重复代码很烦的好不好那么如何只用一行代码复用这些重复的参数？？我们可以用hooks来解决hooks是在react16.8.0新增的特性，碰巧那时我也正在写react，写过react的都知道，那时候主流是类组件，hoo
2022-12-05 17:42:12
780
原创 解决uniapp+vue3 getAppWebview为undefined的问题
例如要做一个截屏分享的功能，从vue2转过来都是this.$mp.getAppWebview()，在vue3下编译出来为空,获取instance之后。里面也没有这个方法这个是原写法。
2022-08-01 10:34:16
5575
4
原创 bug记录之vuecli5自定义cssmodules哈希类名
项目场景：场景：我这用vue3+tsx开发的项目，直接每个页面引入单独的样式文件会造成全局样式污染，所以需要开启cssmodule，但是vuecli没配置过自定义类名，所以出来的只有哈希值，到时候找页面会很不好找问题描述根据文档中的来配置会报错,官方文档配置代码如下 loaderOptions: { css: { // 注意：以下配置在 Vue CLI v4 与 v3 之间存在差异。 // Vue
2022-05-07 12:06:53
852
原创 typescript实现简单的防抖与节流
typescript实现简单的防抖与节流文章目录typescript实现简单的防抖与节流前言一、防抖和节流是什么？二、函数实现3.使用示例前言前端开发中经常会遇到防抖和节流的业务需求，用原生js写防抖和节流会受到typescript限制提示：以下是本篇文章正文内容，下面案例可供参考一、防抖和节流是什么？防抖：使传入一个函数在n秒后执行，如果在n秒内又触发防抖函数，则定时器重0开始计时节流：使一个函数间隔n秒执行一次二、函数实现 /** * 防抖函数 *
2022-02-27 19:05:31
3674
2
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人