- 博客(267)
- 资源 (1)
- 收藏
- 关注
RSS订阅原创 发布订阅模式以及mitt源码实现
发布-订阅者模式（Publish-Subscribe Pattern）是一种软件设计模式，用于实现对象间的一对多通信。在该模式中，存在两种角色：发布者（Publisher）和订阅者（Subscriber）。
2024-04-18 15:03:11
310
原创 项目中自动引入神器 - unplugin-auto-import/unplugin-vue-components
在开发中，我们总喜欢站在巨人的肩膀上开发，比如用一些框架：vue,react,组件库：element，ant。工具函数：axios，lodash现在是模块化时代，我们也喜欢封装一些组件/工具库，但是都需要引入。v3更是改成composition API ,用那个引入那个，不知道你为此是否感到繁琐，今天就让我们来学习使用两款插件，解放双手，让我们有更多的摸鱼时间🦑。
2024-03-28 15:00:59
342
原创 vue3 中 主题定制
我们在切换主题的时候，在组件内其实没有做任何处理，是在pinia 里做的监听持久化 这里用到了 persist 插件通过向外暴露setupTheme 来实现 修改主题。
2024-03-01 18:25:16
467
原创 vue3 图片/视频 加载失败重试
媒体组件，提供了失败的回调，可以使用失败回调，不断的load来加载数据加载成功后，或者到达一定次数时，注意及时销毁。
2024-02-29 10:53:07
746
原创 vue3 实现一个简单的输入框
需要一个输入框，可以输入文字，添加表情，一开始用了**富文本编辑器**，有点大材小用，所以自己封装一个输入框组件。支持输入文字，选择表情/插入表情，支持组合键换行，使用enter
2024-02-29 10:06:03
1025
原创 查看 npm的一些命令，以及npm config set registry x x x 不生效 解决方案
其他配置文件干扰：在某些情况下，可能存在其他配置文件覆盖了 npm 的配置。你可以检查是否存在其他配置文件，如 ~/.npmrc 或项目根目录下的 .npmrc 文件，并确保其中没有覆盖 npm 源的配置。该文件通常位于 ~/.npmrc （用户级别）或项目根目录下的 .npmrc （项目级别）。这会显示 npm 的配置信息，包括当前使用的源（registry）。将 替换为你想查看的配置项的键名，比如 registry。修改完保存后，重新运行 npm 命令时应该会使用新的源。
2024-01-31 14:19:12
1903
原创 vue3 根据点击位置，实现一个用户头像弹框定位
最近在做直播后台，涉及到对用户的一些操作，比如关注/取关/禁言/踢出直播间。多个地方都要用，需要封装一个弹框组件。
2024-01-26 12:06:15
576
原创 vue3 中组合键 command+Enter / shift+Enter / alt + Enter 实现换行，详细实现
原生 Enter 天然支持换行，但是我们需要阻止掉。但是组合键又需要自己去实现换行，本文根据计算光标的位置，实现了使用组合键换行
2024-01-23 15:04:28
885
原创 小程序实现一个 倒计时组件
初始化时间： 如果服务度返回了时间差，这一步不用处理。时间的格式化处理，这里都是固定代码，没什么含量。tick 倒计时函数。
2023-09-14 17:36:09
739
原创 rrweb入门
rrweb是，是当下很流行的一个录制屏幕的开源库。与我们传统认知的录屏方式（如 WebRTC）不同的是，rrweb 录制的不是真正的视频流，而是一个记录页面 DOM 变化的 JSON 数组，因此不能录制整个显示器的屏幕，只能录制浏览器的一个页签(录屏)。
2023-09-07 18:05:56
1324
1
原创 vue3封装一个通用的弹框事件函数
在弹框的时候，我们总是要设置变量，去控制弹框的打开和关闭，要写很多的事件和很多变量名，那么封装一套弹框的事件，去控制，就要好很多。
2023-05-10 10:48:35
242
1
原创 return false和 return true 的作用是什么
在 JavaScript 中，return false 和 return true 是两个不同的返回值。它们的作用也不同，具体取决于它们所在的上下文环境。
2023-04-12 14:53:38
1182
原创 vue拖拽删除实现
自营上传图片，但是需要排序和删除功能，所以用到了h5的拖拽源元素： 即被拖拽的元素。目标元素： 即合法的可释放元素。每个事件的事件主体都是两者之一。
2022-11-25 14:37:44
4831
2
原创 javascript 中的纯函数
纯函数是这样一种函数,相同的输入，永远会得到相同的输出，而且没有任何可观察的副作用比如常用的slice和splice，这两个函数的作用别二致。但是slice符合纯函数的定义，因为对于相同的输入，他能保证相同的输出。而splice却会嚼烂调用他的那个数组，然后吐出来；这样就会产生观察到的副作用。
2022-09-21 10:31:45
425
原创 使用JSON.stringify()格式化数据
官网指南主要就是用到了，JSON.stringfy()的第二个参数，和第三个参数。具体看文档，不做赘述官网指南
2022-07-11 18:17:10
1800
原创 mac 查看端口被占用 /杀死占用进程
1.查看进程号ps -ef | grep 进程名2、查看端口被哪个进程监听sudo lsof -i:80801此时必须要输入sudo，不然无法正常显示3.查看进程监听的端口sudo lsof -nP | grep LISTEN | grep 33064.查看进程sudo lsof -i tcp:port如：sudo lsof -i tcp:80805.杀死进程的方式sudo kill -9 PID如：sudo kill -9 750...
2022-05-07 15:49:09
236
原创 数据类型 - 原始类型的方法
原始类型的方法前言与原始数据类型相对的是引用数据类型。引用数据类型，许多内建对象具有不同的属性和方法，但是这些特性(feature)都是有成本的，需要额外的资源支持运作。当做对象的原始类型其实这是有些悖论的人们可能想对诸如字符串或数字之类的原始类型执行很多操作。最好使用方法来访问它们。原始类型必须尽可能的简单轻量。为了使基本数据类型可以拥有方法，创建了提供额外功能的特殊“对象包装器”，使用后即被销毁。“对象包装器”对于每种原始类型都是不同的，它们被称为 String、Number、
2022-05-05 15:34:11
186
原创 js 循环对象时，输出顺序为什么会乱？
先看一个demo输出顺序从 这里可以看出，数字按升序的顺序输出，字符串按，创建时的顺序输出，这也是ECMAScript规范中定义「数字属性应该按照索引值⼤⼩升序排列，字符串属性根据创建时的顺序升序排列。并且数字属性优先于字符串」下面我们来看下这个规范下实现的过程以及原因首先JS代码本身是不会直接被计算机执行，计算机只能接收二进制的汇编代码，所以，中间需要一层转化，而这个转化，在chrom就是v8引擎在v8 里是怎么样存储和读取对象属性的呢，在v8里，将对象里的属性，分为两大类。
2022-05-05 10:34:20
2006
原创 js -最大连续子数组问题
最大连续子数组的和const getMaxSubSum = (arr) => { let maxSum = 0; let partialSum = 0; for (let item of arr) { partialSum += item; maxSum = Math.max(partialSum, maxSum); console.log('partialSum', partialSum) console.log('maxSum', maxSum) if (
2022-04-27 13:02:35
350
原创 js -对连续月份数据做处理拆分
需求背景积分列表，返回用户的积分数据，想做一个按月的展示。想着后端按月返回不就可以了，但是要做触底翻页，每个月的数据也不确定，不太好做拆分，那就前端来搞吧数据这里是二月和三月的分界点，我们要把数据处理成这种格式即可有一个标识，判断显示时间那条数据，并且时间那条数据也要在列表里，应为要做循环转换后数据格式这样循环的时候，判断type == ‘tag’ ,则显示月份，下一个数据，正常循环代码list.forEach((item) => { const { desc: lab
2022-04-22 20:09:02
591
原创 讲 透Object.prototype.toString.call()
Object.prototype.toString.call()这个方法是用来判断数据类型的，主要用到的知识点是原型，原型链，toString(),calltoString每个对象都有一个 toString() 方法，当该对象被表示为一个文本值时，或者一个对象以预期的字符串方式引用时自动调用。默认情况下，toString() 方法被每个 Object 对象继承。如果此方法在自定义对象中未被覆盖，toString() 返回 "[object type]"，其中 type 是对象的类型。demo
2022-04-22 14:22:41
4815
1
原创 小程序 - canvas绘制海报
需求背景小程序不能直接分享至朋友圈，所以采用海报(最关键的就是邀请码)邀请好友。从展示层面来讲，就是几张图，通过定位放在一起即可，但是关键是要保存，这个时候，就需要canvas去进行图片合成。那么canvas绘制海报，就拆分两个部分通过css ,给用户展现的组合图片,这跟简单通过css 布局，将各个元素组合在一起。这个想必不用多说，保存时，通过canvas绘图，将图片合成一个完整的图片canvas 绘图，有两种模式新版 2d 模式(有坑，慎用)老版 canvas-id=“draw
2022-04-20 18:40:08
3426
1
原创 小程序 - wxs
wxs： 在小程序里写函数表达式，做数据处理官方文档wxsWXS（WeiXin Script）是小程序的一套脚本语言，结合 WXML，可以构建出页面的结构。WXS 与 JavaScript 是不同的语言，有自己的语法，并不和 JavaScript 一致。在wxs里写正则，将. 替换为 / 象需要使用 getRegExp函数。wxs 判断数据类型...
2022-04-20 16:11:17
821
原创 小程序 - 超过两件折叠展开逻辑
需求背景:小程序商品数据不是太多，所以无需分页，但是全部展示又太占位置。所以做一个超过两件进行展开折叠，用户自己效果图实现思路前景： 超过两件，展示展开折叠图例。点击图例，传数据，和标识进去。如果 showAll == true ，表明要全部展示，直接将传入的数据返回如果showAll == false , 表明只展示两件。循环传入数据，将其保存，并返回index.wxsvar goodsList = function (list = [], showAll) { if (showAll
2022-04-20 15:28:25
437
1
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人