- 博客(498)
- 收藏
- 关注
RSS订阅原创 彻底弄懂css filter滤镜 === 使用filter将彩色图片变成黑白
CSS属性将模糊或颜色偏移等图形效果应用于元素。滤镜通常用于调整图像，背景和边框的渲染。改进方法：在image标签外面套一层view，在view上面降低暗度，这样圆角就有效果了。HSL色彩模型就是色相、饱和度和明暗度三者混合组成的颜色模型。需求：用户在线头像为原始的彩色图片，离线将用户头像改为黑白色。可以使用单个滤镜函数，也可是同时使用多个滤镜函数。发现class b-r100也就是border-
2024-09-16 23:18:42
803
原创 微信小程序----日期时间选择器（自定义时间&&精确到分秒）
pickerReady 为了保证加载顺序初始化正常 Skyline 模式下初始化会触发change 导出初始化异常。未解决 用户快速滚动会造成页面卡死 有思路的大佬可以留言解决方案。其他限制条件可修改组件中的compareTime函数定义。微信小程序自定义时间选择器，支持多种自定义功能。复制链接在浏览器中打开。
2024-09-16 22:58:00
631
原创 TypeScript 快速上⼿ （3：装饰器）
装饰器本质是一种特殊的函数，它可以对：类、属性、方法、参数进行扩展，同时能让代码更简洁。装饰器自2015年在中被提出到现在，已将近10年。截止目前，装饰器依然是实验性特性 ，需要开发者手动调整配置，来开启装饰器支持。装饰器有 5 种：1⃣类装饰器2⃣属性装饰器3⃣方法装饰器4⃣访问器装饰器5⃣参数装饰器备注：虽然中可以直接使用**类装饰器**，但为了确保其他装饰器可用，现阶段使用时，仍建议使用配置来开启装饰器支持，而且不排除在来的版本中，官方会进一步调整装饰器的相关语法！
2024-09-15 21:53:26
808
1
原创 微信小程序使用 ==== 粘性布局
单词sticky的中文意思是“粘性的”，表现也符合这个粘性的表现。基本上，可以看出是和的结合体——当元素在屏幕内，表现为relative，就要滚出显示器屏幕的时候，表现为fixed。例如，可以滚动下面这个框框感受下交互表现：其中导航元素设置了如下CSS：nav {top: 0;于是，正如大家看到，随着页面的滚动，当导航距离上边缘0距离的时候，黏在了上边缘，表现如同。
2024-09-14 21:11:46
1568
原创 从page-container跳转下一页面，再返回，page-container页返回按钮无效？
问题描述：从首页跳转详情页，在详情页打开page-container并跳转编辑页，再从编辑页返回详情页后，详情页的返回按钮失效，无法返回首页。经过多次测试终于找到问题所在，当页面跳转时如果触发了关闭page，show状态值会丢失，所以在返回页面时当前页的返回按钮找不到show状态值，解决的办法有两个，可以试一下把page-container封装成一个组件，在封装组件的pageLifetimes里面手动控制show的状态。一：返回页面时在onShow中对page的show重新赋true或false，
2024-09-14 11:48:09
238
原创 微信小程序 === 长列表性能优化
列表滚动时常会和特殊布局能力结合使用，如滚动到顶部时自动吸顶sticky效果，或瀑布流布局。Skyline内置了这部分能力，可直接使用和grid-view组件实现。list-view组件的效果跟列表模式是等价的，如果不需要这些特殊布局能力，可任意选择写法。需要注意的是自定义模式下，ScrollView直接子节点本身并没有按需绘制优化，按需绘制的能力是list-view组件实现的，custom模式组合了这些能力。-- 非 list-view 子节点，无按需绘制优化 -->
2024-09-08 10:47:00
1306
原创 前端算法 === 933. 最近的请求次数
写一个类来计算特定时间范围内最近的请求。请你实现tt3000每次对ping的调用都使用比之前更大的t值。]，范围是 [-2999,1]，返回 1]，范围是 [-2900,100]，返回 2]，范围是 [1,3001]，返回 3]，范围是 [2,3002]，返回 3。
2024-08-28 10:15:45
724
原创 前端算法 === 力扣 111 二叉树的最小深度
DFS和BFS都是解决这个问题的有效方法。DFS的优点是代码简单，但可能在某些情况下效率不如BFS。BFS通常更直观，因为它逐层遍历树，而且对于这个问题，BFS可以更快地找到最小深度，因为它会在找到第一个叶子节点时立即停止搜索。然而，BFS需要额外的存储空间来存储队列。根据具体问题和场景，你可以选择适合的方法。
2024-08-26 16:49:53
507
原创 前端算法 ==== 栈的好戏还要继续！| 1047. 删除字符串中的所有相邻重复项
给出由小写字母组成的字符串S会选择两个相邻且相同的字母，并删除它们。在 S 上反复执行重复项删除操作，直到无法继续删除。在完成所有重复项删除操作后返回最终的字符串。答案保证唯一。"abbaca""ca"例如，在 "abbaca" 中，我们可以删除 "bb" 由于两字母相邻且相同，这是此时唯一可以执行删除操作的重复项。之后我们得到字符串 "aaca"，其中又只有 "aa" 可以执行重复项删除操作，所以最后的字符串为 "ca"。
2024-08-25 18:31:14
288
原创 前端算法 === 栈的拿手好戏！| 20 有效的括号
有的同学经常会想学的这些数据结构有什么用，也开发不了什么软件，大多数同学说的软件应该都是可视化的软件例如APP、网站之类的，那都是非常上层的应用了，底层很多功能的实现都是基础的数据结构和算法。时，字符串 "(}" 包含一个左括号 "(" 和一个错误的右括号 "}". 当遇到右括号 "}", 栈中应该弹出一个左括号 "{" 来匹配它，但栈中实际上是 "("。题意其实就像我们在写代码的过程中，要求括号的顺序是一样的，有左括号，相应的位置必须要有右括号。第一种情况，字符串里左方向的括号多余了 ，所以不匹配。
2024-08-25 11:24:40
472
原创 前端算法 === 计数排序
计数排序是一种简单而高效的排序算法，特别适合于处理一定范围内的整数排序问题。它的核心思想是利用额外的存储空间来记录数组中每个元素出现的次数，然后根据这些计数来重新构建一个有序的数组。以下是对计数排序算法的详细介绍。
2024-08-24 16:42:09
448
原创 JavaScript 数据结构 ==== 二叉树
二叉树中的节点最多只能有2个子节点，一个是左侧子节点，一个是右侧子节点，这样定义的好处是有利于我们写出更高效的插入，查找，删除节点的算法。二叉搜索树是二叉树的一种，但是它只允许你在左侧子节点存储比父节点小的值，但在右侧节点存储比父节点大的值。接下来我们将按照这个思路去实现一个二叉搜索树。
2024-08-24 12:53:14
1226
原创 用 JavaScript 实现归并排序
在本文中，我们了解了Merge Sort算法背后的逻辑，并用 JavaScript 实现。它是基本排序算法之一，可以帮助我们更好的了解分治法策略。
2024-08-21 18:07:10
852
原创 前端算法 | LeetCode第 70 题爬楼梯问题
第一步：如果你现在只有1个台阶（n=1），你只有一种方法，那就是直接走上去。所以，f(1)=1。第二步：如果你有2个台阶（n=2），你有两种方法：先走1个台阶再走1个台阶，或者直接走2个台阶。所以，f(2)=2。
2024-08-21 11:49:37
787
原创 TypeScript 快速上⼿ （2）
/ PersonInterface接口，用与限制Person类的格式// 定义一个类 Person，实现 PersonInterface 接口// 实现接口中的 speak 方法i < n;i++) {// 打印出包含名字和年龄的问候语句console.log(`你好，我叫${this.name}，我的年龄是${this.age}`);// 创建一个 Person 类的实例 p1，传入名字 'tom' 和年龄 18// 只读属性age?: number;// 可选属性。
2024-08-17 22:49:37
1456
原创 TypeScript 快速上⼿ （1）
⼀、TypeScript 简介1.TypeScript由微软开发，是基于JavaScript的⼀个扩展语⾔。2.TypeScript包含了JavaScript的所有内容，即：TypeScript是JavaScript 的超集。3.TypeScript增加了：静态类型检查、接⼝、 泛型等很多现代开发特性，更适合⼤型项⽬的开发。4.TypeScript需要编译为JavaScript，然后交给浏览器或其他JavaScript运⾏环 境执⾏。
2024-08-15 15:24:57
815
原创 微信小程序 ==== 半屏打开小程序
当小程序需要打开另一个小程序让用户进行快捷操作时，可将要打开的小程序以半屏的形态跳转。只有在当前小程序是被其他小程序打开时可以调用成功。获取本次小程序启动时的参数。：当前是插件页面时，宿主小程序不能调用该接口，反之亦然。：当前是插件页面时，宿主小程序不能调用该接口，反之亦然。基础库 2.20.1 开始支持，低版本需做。基础库 1.3.0 开始支持，低版本需做。：支持，需要小程序基础库版本不低于。：支持，需要小程序基础库版本不低于。时，可以判断此时小程序被半屏打开。被半屏打开的小程序可以以通过调用。
2024-08-14 18:24:21
1211
原创 深入理解IP地址、子网掩码、网关的概念
即“网络之间能相互连通的协议”，即计算机与计算机之间借助网络的相互通信都得遵循IP协议。IP地址是用来标识每台计算机的身份，它为互联网上的每台计算机分配一个逻辑地址，标识这台计算机的唯一。即计算机的网络身份证。打个比方，你开车允许你上高速公路，那么你的车辆就必须得上牌照，别人的车辆也上了牌照，那么大家都可以上高速公路，车辆没上牌照的就不能上公路了。而在这里这个IP协议，就相当于车辆需要安装的牌照。即用来判断两台计算机的IP地址是否属于同一个网络段的判断。
2024-08-13 09:22:35
1688
原创 程序员 Homebrew 使用指南
对于习惯了使用命令来完成一切的程序员来说，安装软件这种小事，自然是能够用命令解决，就不用图形界面选择。但是在 Linux 中，我们有yumaptdnfpkg等命令来完成软件的安装，macOS 却并未为我们提供一个好用的包管理器，帮助我们更好的使用 macOS。好在，虽然官方没有提供，我们却可以使用这一神器，来完成类似的工作，就如同 Homebrew 的 Slogan ：“The missing package manager for macOS (or Linux)”
2024-08-12 16:27:09
1408
原创 ping和telnet测试连通性小结
ping和telnet是测试网络连通时最常用的两个命令， 一般用ping命令测试网络是否通畅或网络连接速度(Ping域名可以得出解析IP) ，用telnet命令则用于测试目标主机是否打开了某端口（默认是23）。常见的使用场景是，不管三七二十一，先ping一下域名或IP，确认能连通到目标主机，然后再根据需要用telnet IP port测试目标主机上的某个端口是打开的。要理解这些情况，就需要弄清楚ping和telnet到底做了什么。
2024-08-12 11:26:24
577
原创 微信小程序如何实现页面传参
只要你的小程序超过一个页面那么可能会需要涉及到页面参数的传递，下面我总结了 n 种页面方法。全局变量大家可以针对具体业务场景来进行选择合适自己的传参方式。
2024-08-12 10:20:55
839
原创 小程序中的WXS脚本
WXS（WeiXin Script）是小程序的一套脚本语言，结合WXML，可以构建出页面的结构。【注意】<wxs>模块只能在定义模块的 WXML 文件中被访问到。使用<include>或<import>时，<wxs>模块不会被引入到对应的 WXML 文件中。<template>标签中，只能使用定义该<template>的 WXML 文件中定义的<wxs>模块。
2024-08-08 18:25:35
685
原创 微信小程序之behaviors
behaviors是用于组件间代码共享的特性，类似于一些编程语言中的 “mixins” 或 “traits”。每个behavior可以包含一组属性、数据、生命周期函数和方法。组件引用它时，它的属性、数据和方法会被合并到组件中，生命周期函数也会在对应时机被调用。每个组件可以引用多个behaviorbehavior也可以引用其它behavior。
2024-08-04 19:01:28
1467
1
原创 速通JS模块化规范
●将程序文件依据一定规则拆分成多个文件，这种编码方式就是模块化的编码方式。●拆分出来每个文件就是一个模块，模块中的数据都是私有的，模块之间互相隔离。●同时也能通过一些手段，可以把模块内的指定数据“交出去”，供其他模块使用。
2024-07-30 16:29:42
2002
原创 使用 URLSearchParams 读取和更新查询参数
前端中常见的任务之一是获取url上的参数。但是似乎很少有人知道，现在有一个 API 用于处理直接嵌入到浏览器中的查询参数，它称为。在这篇文章中，我们将快速体验一下 API，看看使用查询参数有多么容易。
2024-07-29 09:37:11
351
原创 fetchApi === 入门篇
原生fetch虽然已经支持 promise 了，相比 XMLHttpRequest 已然好用了很多，但是参数还是需要自己处理，比较麻烦。通过数据流（Stream对象）处理数据，可以分块读取，有利于提高网站性能，对于大文件或者网速慢的场景极为有用。采用了模块化设计，API分散于多个对象中（如：Response对象、Request对象、Header对象）Response 对象根据服务器返回的不同类型的数据，提供了不同的读取方法。，此外还可以接收第二个参数，作为配置对象，可以自定义发出的HTTP请求。
2024-07-27 11:32:49
860
原创 JavaScript中 FileReader 对象详解
FileReader 对象允许 Web 应用程序异步读取存储在用户计算机上的文件（或原始数据缓冲区）的内容，使用 File 或 Blob 对象指定要读取的文件或数据。其中 File 对象可以是来自用户在一个 < input > 元素上选择文件后返回的 FileList 对象，也可以来自拖放操作生成的 DataTransfer 对象，还可以是来自在一个 HTMLCanvasElement 上执行 mozGetAsFile() 方法后返回结果。
2024-07-24 11:31:03
2161
原创 彻底理解前端 ==== 表单，FormData 对象
<label for="name">用户名：</label></div><div><label for="passwd">密码：</label>
2024-07-23 11:04:27
767
原创 解决错误：Do not access Object.prototype method ‘hasOwnProperty‘ from target object no-prototype-builtins
Object.create(null) 创建的对象是一个空对象，在该对象上没有继承 Object.prototype 原型链上的属性或者方法,例如：toString(), hasOwnProperty()等方法。Object.create(null)是一种常见的模式，用于创建将用作映射的对象。可以通过使用call()函数来调用不属于本身this对象的方法：Object.hasOwnProperty.call()调用 hasOwnProperty 报错：不要使用对象原型上的方法，因为原型的方法可能会被重写。
2024-07-23 10:02:37
290
原创 如何在 JavaScript 中检查函数是否异步
检查非异步函数是否返回 Promise 的唯一方法是调用它。请注意，如果函数状态发生变化，则调用该函数可能不安全，例如写入数据库。检查该函数是否是异步的 – 然后它会返回 100% 的承诺 时间。检查函数的返回值是否是具有属性的对象 类型函数。
2024-07-23 09:09:42
973
原创 详细讲解vue3 watch回调的触发时机
然而在有些情况下，我们需要在状态变化时执行一些“副作用”：例如更改 DOM，或是根据异步操作的结果去修改另一处的状态。同一个“tick”的意思是，Vue的内部机制会以最科学的计算规则将视图刷新请求合并成一个一个的"tick"，每个“tick”刷新一次视图，比如。Vue 的响应性系统会缓存副作用函数，并异步地刷新它们，这样可以避免同一个“tick”中多个状态改变导致的不必要的重复调用。这意味着如果你尝试在侦听器回调中访问所属组件的 DOM，那么 DOM 将处于更新前的状态。的所属组件的 DOM，你需要指明。
2024-07-22 18:53:41
1214
原创 vue3大事件管理系统 === 文章管理页面 - [element-plus 强化]
chatGPT prompt：封装一个函数，基于 axios， 网络图片地址，转 file 对象， 请注意：写中文注释。组件对外暴露一个方法 open, 基于 open 的参数，初始化表单数据，并判断区分是添加 还是 编辑。默认是英文的，由于这里不涉及切换， 所以在 App.vue 中直接导入设置成中文即可，为了便于维护，直接拆分成一个小组件 ChannelSelect.vue。添加 和 编辑，可以共用一个抽屉，所以可以将抽屉封装成一个组件。如果是编辑操作，一打开抽屉，就需要发送请求，获取数据进行回显。
2024-07-21 21:32:54
684
原创 重新安装依赖后，sass报警告Sass‘s behavior for declarations that appear after nested rules will be changing
今天拉取代码，重新执行pnpm i安装依赖后。发现终端出来了一堆的警告，& {}│。
2024-07-20 10:14:03
2971
原创 vue3大事件管理系统 === 首页 layout & 文章分类页面 -
组件对外暴露一个方法 open, 基于 open 的参数，初始化表单数据，并判断区分是添加 还是 编辑。需求：只有登录页，可以未授权的时候访问，其他所有页面，都需要先登录再访问。添加 和 编辑，可以共用一个弹层，所以可以将弹层封装成一个组件。el-container 右侧。el-aside 左侧。
2024-07-19 14:37:43
876
原创 vue开启eslint后一些⚠️警告处理记录
注意：在 JavaScript 中对象和数组是通过引用传入的，所以对于一个数组或对象类型的 prop 来说，在子组件中改变变更这个对象或数组本身将会影响到父组件的状态。出现这个问题可能是在给组件命名的时候没有使用大驼峰和横线拼接单词，编译的时候会一直报错，而实际上是语法检测问题，每个人或者每个公司团队对语法标准设置不同，这个子组件接下来希望将其作为一个本地的 prop 数据来使用。②：如果这个 prop 以一种原始的值传入且需要进行转换。意外变更父级组件的状态内容，这样会导致你应用的数据流向杂乱无章。
2024-07-17 18:13:50
653
原创 vue中props传值，父组件向子组件传递对象可以直接修改的问题
3.上面简要分析了一下vue组件通信中，父组件传一个对象给子组件，子组件可以直接修改这个数据，并且可以影响父组件的问题，里面涉及到堆空间、栈空间等JavaScript数据类型以及浏览器底层原理的东西，感兴趣的话可以阅读一下相关知识点。从上图可以看到，对象类型是存放在堆空间的，在栈空间中只是保留了对象的引用地址，当 JavaScript 需要访问该数据的时候，是通过栈中的引用地址来访问的，所以，，其中的代码空间主要是存储可执行代码的，栈空间就是调用栈，是用来存储执行上下文的，堆空间是用来储存引用数据类型的。
2024-07-17 17:45:55
918
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人