- 博客(420)
- 资源 (37)
- 问答 (2)
- 收藏
- 关注

原创 Taro React 系列文章 - 总目录
欢迎大家来到 Rattenking 的《Taro React 入门到实战系列》,开始前博主先列出 Taro React 入门到实战的大纲,同时包括遇到的一些常见报错。实战篇是实际开发中的组件的封装,部分比较有意思的效果,以及一些特殊实际问题的解决办法!入门篇介绍了从安装,开发中的配置问题,记录解决对应的问题。错误篇是在实际开发中遇到的一些错误的处理方法!问题篇是开发中遇到的一些问题的解决方法!...
2022-08-17 15:53:17
484

原创 GIT 命令学习总结导航
1. 实战问题解决和总结github page搭建自己的页面git常用命令GIT ---- GIT 同步远程库操作GIT ---- GIT命令行简写配置2. 学习GIT命令步骤GIT学习----第一节:提交文件到仓库GIT学习----第二节:查看工作区的状态GIT学习----第三节:版本回退GIT学习----第四节:工作区和暂存区GIT学习----第五节:管理修改GIT学习----第六节:撤销修改GIT学习----第七节:删除文件GIT学习----第八节:本地版本库命令总结
2021-11-04 10:52:18
332
3

原创 微信小程序实例系列
下载微信小程序实现部分高德地图功能的DEMO下载微信小程序实现MUI的部分效果的DEMO下载更多微信小程序实例GITGIT地址 https://github.com/Rattenking/WXTUI-DEMOGIT下载 git clone https://github.com/Rattenking/WXTUI-DEMO.git常见...
2018-02-08 11:11:12
56418
19

原创 前端笔记列表
基础知识神奇的position:sticky双飞翼布局的原理圣杯布局的原理Browser 对象(一、history)JS获取当前网址信息前端常见面试题前端自适应—-单位remnode.js 获取url中的各个参数nodejs之url模块nodejs之querystring模块如何写出优美的 JavaScript 代码?获取某个数内的质数github page搭建自己的...
2018-01-30 16:58:21
3163

原创 游戏系列文章 - 总目录
DEMO下载五子棋悔棋DEMO 五子棋AI篇DEMO文字列表五子棋微信小程序(游戏)—-五子棋(棋盘,重置,对弈篇) 微信小程序(游戏)—-五子棋(悔棋篇) 微信小程序(游戏)—-五子棋(AI篇) 微信小程序(游戏)—-五子棋(总结)拖拽拼图微信小程序(游戏)—-拼图游戏(设计思路) 微信小程序(游戏)—-拖拽拼图(图片分块和打乱顺序) 微信小程...
2018-01-11 16:22:54
4316
1
原创 JavaScript ---- 使用原生 JavaScript 实现俄罗斯方块
俄罗斯方块(俄语:Русская клеточная игра или Русская клеточная игра в квадрате)是一款经典的益智类游戏,其规则简单,操作简单,具有很高的趣味性。俄罗斯方块是一款2D的益智游戏,玩家控制一个方块在一个方格内自由移动,通过控制方块的旋转、下落、以及移动,来消除周围的方块,并在此过程中获得分数。方块由四个小方块组成,每个小方块都有四个角落,四条边,以及一个中心点。方块可以旋转,但不能翻转。方块只能在空白的格子上移动。
2025-04-03 10:12:23
255
原创 【JavaScript】---- 数组的交集,并集,差集的实现,以及Set对象的交集,并集,差集的详细介绍和使用
数组的交集,并集,差集的实现。其实本质来说都不算难,但是 Set 类直接实现这些方法,所以我们先自己实现一下,然后再讲解一下 Set 类的相同方法。Set 类的方法,每次都需要我们将数组转换为 Set 对象,做了对应操作后,再转会数组。我们自己通过数组方法实现,需要对返回结果去重操作,我这里的 difference 和 intersection 没有进行去重操作。
2025-04-03 09:45:03
503
原创 node ---- 解决错误【Error: error:0308010C:digital envelope routines::unsupported】
错误是由于 Node.js 17+ 默认使用 OpenSSL 3.0 导致的。通过启用旧版 OpenSSL 提供程序、降级 Node.js 版本或更新项目依赖,可以解决此问题。在开发环境中,可以使用临时解决方案快速修复问题,但在生产环境中,建议采用更安全的长期解决方案。
2025-04-03 09:42:47
715
原创 npm ---- 解决【error when starting dev server: TypeError: crypto$2.getRandomValues is not a function】
当使用 vite 创建 vue 项目的时候,使用 npm run dev 启动创建项目的时候报错。找到报错的原因,如果是浏览器环境,那么就可能是浏览器环境不支持 crypto.getRandomValues 方法,可以考虑安装库来解决浏览器兼容性;由于我是在启动项目时报错,还没有到浏览器访问,因此就是启动的 node 环境存在问题;说明当前 node 环境版本太低导致的,升级 node 的版本,就能解决;升级 node 版本的两种方法,方案一:安装一个高版本的 node;
2025-04-02 09:14:25
1100
原创 GIT ---- 解决【fatal: Authentication failed for】
按照提示完成密钥生成过程,生成的密钥默认存储在 ~/.ssh/id_ed25519 和 ~/.ssh/id_ed25519.pub。将 your-github-username 替换为你的 GitHub 用户名, your-personal-access-token 替换为你生成的个人访问令牌。在命令行中,当你进行 git push 或者 git clone 操作时,将原来使用的密码替换为个人访问令牌。在输入密码的提示处,输入你刚才生成的个人访问令牌。
2025-04-02 09:12:44
861
原创 【Python 实战】---- 实现批量发送邮件,通过读取 excel 中的发送内容
在生活中,我们经常遇到的事情就是邮箱收到自己的工资条。你想一个公司如果只有几个人,那么还好说,但是如果上了十个以上,对于大多数人来说,这就是一件比较麻烦的事情。重复的劳动需要重复几十次几百次几千次,这样的事情对于一个程序员来,是不是很 low?那么人事的小姐姐,就需要我们给他开发一个自动化脚本,它只需要将发送的邮箱和内容写在一个 excel 的表格中,通过表格读取内容,然后自动发送到对应的邮箱中,是不是很简单?
2025-03-12 10:49:31
365
原创 五分钟快速入门:使用 Trae 开发你的第一个VS Code插件
最近改用 Trae 作为开发工具,想体验一下它的 Builder 功能,当然也有程序员,都是一群能过够自动化,绝不多写一行代码的人,因此就使用 Builder 功能开发一个 vscode 的插件。插件开发什么功能呢?Taro React 快速创建新页面,官方就有这个命令脚本,当然 vscode 的插件市场也是存在这个插件的,不过我们这里就以这个功能为基础开发一个我们自己的插件,必定主要是为了体验 Builder 功能,因此开整!!!
2025-03-12 10:47:31
789
原创 Taro React组件开发 —— RuiNoticeBar 通知栏
其实之前实现过一个Taro React组件使用(11) —— RuiNoticebar 公告栏,这个是根据NUTUI实现的,但是最近不是写了一篇【CSS】---- 纯 CSS 实现无限滚动轮播,实现是简单了,但是如果能够将复制元素进行封装在组件内部,而不是直接展示在页面,就能更加完美,所以以【CSS】---- 纯 CSS 实现无限滚动轮播为基础,对 RuiNoticebar 公告栏进行封装组件。将滚动动画的元素和复制的元素放到一个盒子里;给盒子设置动画;
2025-03-06 14:45:08
164
原创 【CSS】---- 纯 CSS 实现无限滚动轮播
仅使用 CSS 创建一个具有无限滚动轮播的动画,无需 JavaScript。首先是无限滚动轮播动画效果在我们常见的开发中都是借用 JavaScript 实现,如果纯粹使用 CSS,我觉得还是一个比较有趣的。动画向左移动直到隐藏使用 transform: translateX(-100%),这里的动画是在动画结束时,第一组元素刚好全部隐藏。第二组元素本来是完全隐藏,在执行 transform: translateX(-100%),动画结束时,刚好从隐藏状态全部显示出来。
2025-03-06 10:59:33
860
原创 【JavaScript】---- JS 数组新方法 with 的使用
当然复制数组的方法还有很多,这里我只举例了我最常用的两种;可以看到,在不修改原数组的要求下,要改变数组的某个元素,在 with 之前,都需要先进行一步复制数组的操作,然后再对复制数组对应索引进行修改;从表面看,就是将复制数组和修改索引值两步合并到一个函数,但是可以对其性能进行测试,测试一下差距。Array.prototype.with() 通过复制原数组实现不可变修改,适合小数据量和函数式场景,但需注意大数组的性能损耗。
2025-02-26 09:45:00
896
原创 【JavaScript】---- JS原生的深拷贝API structuredClone 使用详解与注意事项
是 JavaScript 内置的深拷贝方法,基于结构化克隆算法,用于复制复杂对象(如包含嵌套对象、数组、Date、Map、Set 等类型的数据),并支持处理循环引用。它替代了传统的 JSON.parse(JSON.stringify()) 深拷贝方法,解决了后者无法复制特殊对象和丢失数据类型的问题。
2025-02-26 09:30:00
925
原创 【CSS】---- CSS 变量,实现样式和动画函数复用
本文介绍 CSS 的自定义属性(变量)来实现样式、动画等 CSS 的复用。都是知道在 CSS 和 JS 复用一个很重要的事情,比如 JS 的函数封装,各个设计模式的使用等等,CSS 中样式的复用,同样重要。MDN 使用 CSS 自定义属性(变量)自定义属性(有时候也被称作CSS 变量或者级联变量)是由 CSS 作者定义的,它包含的值可以在整个文档中重复使用。由自定义属性标记设定值(比如: --main-color: black;
2025-02-20 16:05:28
490
原创 【taro react】 ---- 解决 Swiper 组件的 circular 属性为 true 时,在 H5 出现点击实现失效问题
通过第三步和第四步的结果,可以看出 Swiper 组件的【衔接滑动模式】会导致复制的子组件在H5的时候,会导致子组件的事件失效。通过事件冒泡,在父元素事件统一管理子元素的点击事件;通过 id 来获取点击元素在列表中的索引;通过索引找到列表中对应的元素对象;最后执行原来的点击事件的跳转方法。
2025-02-20 10:00:00
62
原创 【CSS】---- CSS 实现超过固定高度后出现展开折叠按钮
学习使用 CSS 函数 clamp 函数,此函数不但能作为区间取值,还可以作为一种判断;此效果采用的纯 CSS 实现,减少了 JS 操作判断;需要待解决问题,就是临界值 200px 的时候,刚好 200px 不应该显示按钮,超出200px才显示,这个目前还在思考解决办法。
2025-01-16 10:28:56
1175
原创 【CSS】 ---- CSS 实现图片随鼠标移动局部放大特效
使用伪元素配合 CSS 函数计算,减少 DOM 的创建和控制;减少了 JS 的计算量,只用单纯的监听位置和移出,其他计算都交给 CSS 的函数完成,原生 JS 直接减少到 11 行代码,如果使用 vue 或者 react 库 JS 的监听代码量更少;熟练的使用 CSS 一些函数,能够使我们更加便捷的实现很多以前需要 JS 才能实现的复杂特效,所以细学 CSS 还是很有必要的,不断学习前进。
2025-01-15 10:55:32
765
原创 《Flutter 学习笔记》Flutter Windows Android 环境搭建
在系统变量中新增 JAVA_HOME,值为你安装 JDK 的根目录。找到你电脑 jdk 的安装位置。
2025-01-07 10:00:00
461
原创 《Flutter 学习笔记》解决 cmdline-tools component is missing 错误
在配置 Flutter 的镜像成功后,验证命令报错。
2025-01-07 10:00:00
495
原创 【CSS】 ---- CSS 实现图片背景清除的滑动效果三种方法
整体来说就是显示或隐藏的之间进行切换,clip: rect 方法这里我没有实现,所以后边学习到这个 CSS 属性的时候再实现;本来想的是完全使用 CSS 实现,包括 input 的滑动监听,但是由于很久没有看 CSS 的属性,对监听那些不是很熟悉,所以这一篇博客就不实现了,后边边学习边实现对应的应用效果;为什么写这篇博客呢?就是前两天看到一个使用纯 CSS 实现各种效果的专栏,包括滚动监听等,我才发现原来现在CSS都已经这么强大了。
2024-12-31 17:24:18
1291
原创 【taro react】 ---- 实现计算多个数组的笛卡尔积和对应笛卡尔积的逆解析
由于开发中数组的每个元素是对象,而不是测试时使用字符串和数字,因此发现在元素是对象时,你解析就会出现重复,因此需要进行结果的去重。
2024-12-31 11:05:35
378
原创 node(2) - npm run 原理
创建脚本生命周期后,我们就可以在执行打包命令前,执行我们自己开发的脚本,然后再执行打包。比如上边示例,就是我通过脚本命令传递参数,来决定当前项目运行的测试接口环境还是正式接口环境。通过命令简化每次切换接口环境需要人工手动改写。npm run 的执行原理,查找 package.json 文件中的 scripts 字段,然后执行对应的脚本命令。脚本执行的查找规则:当前 .bin > 全局 node_modules > 环境变量 > 报错。
2024-12-17 19:20:14
993
原创 【taro react】 ---- 解决编译 H5 时,偶尔出现多页面一起展示
框架编译后我怀疑就生命周期的执行问题,导致出现了页面没有隐藏的问题,但是多人开发,你也不能修改taro的代码,所以只能在他实现的基础上补充;生命周期拦截的解决方案,这个要求页面必须是 class 组件,才能监听到对应的页面,进行设置,如果使用的 hooks 开发页面,那么这里的拦截不会生效,需要你手动添加页面的显示和隐藏设置代码,由于项目已经维护很久,所以工作量会比较大,因此增加了方案三,路由的监听;
2024-12-17 10:00:00
111
原创 【taro react】 ---- 解决验证表单中多个字段是否为空并提示
Object.entries 方法在大多数浏览器是按照 Object 创建key顺序,但是也存在部分浏览器无序,所以不稳定;在构建验证规则的时候调用了一次方法,后边校验表单的时候调用了一次,然后返回的结果,可能个人不是很喜欢这种操作,所以诞生了在此基础上获取标签的属性。一步一步的完善,从方法一到方法四,基本都在优化完善,最后的使用习惯接近 elementui 的提交校验;功能目前也就只是满足现有需求,还可以添加其他的功能,在开发中遇到了再依次添加。
2024-11-28 23:21:17
476
原创 【解决安全扫描漏洞】---- 检测到目标站点存在 JavaScript 框架库漏洞
最后通过安全扫描,其实这个漏洞只是存在隐患,项目中并没有使用 YUI 的 Flash 组件,因此是不存在这个漏洞,但是项目要通过安全扫描,没有办法,只能根据扫描工具的定位漏洞方法,去解决。这个过程都是根据已存在的博客去依次排查解决,所以这些问题遇到了,就只能看能不能在网上找到解决办法,下一次一个安扫问题,估计不一定能解决。
2024-11-28 15:07:50
5349
原创 【taro react】 ---- 解决 input 、textarea 层级穿透
使用 alwaysEmbed 在安卓没有效果;使用 input 标签和 view 标签切换,存在抖动问题;使用 visibility: hidden 不能对 input 进行聚焦;使用 position: fixed 不能实现【键盘弹起时,是否自动上推页面】;使用 position: absolute 上边的问题都能解决,但是由于光标是使用 css 模拟的,因此高度和颜色不能根据字体颜色改变。
2024-11-18 10:04:53
351
1
原创 【taro react】 ---- 常用自定义 React Hooks 的实现【六】之类渐入动画效果的轮播
组件的实现其实没有太大的难度,就是最近看源码,看到了 React.Children.map 的实现,因此使用这个效果用一下;需要注意的是隐藏显示不要直接操作DOM的显示隐藏,因为DOM的改变会导致图片的重新加载,会出现闪动的效果,这是回流导致的图片重新加载;在组件内渲染子组件的时候依然需要使用 React.Children.map 来循环子组件。
2024-11-07 09:56:14
533
原创 React 源码学习01 ---- React.Children.map 的实现与应用
目前是第一次看这个函数的实现,知道他大概干了什么,也大概明白每一步要干什么,但是目前还不清除他为什么要这么干。为什么要来看他的实现呢?一个是只有知道他是怎么实现的,才能知道在调用这个方法时,那些情况会报错,为什么报错,能够快速处理。使用这个方法开发功能的时候能够更加得心应手。
2024-11-07 09:54:12
750
原创 解决 npm ---- npm ERR! cb() never called! npm ERR! This is an error with npm itself.
其实后边的报错就是因为第六步忽略包关系安装导致的,如果能够知道创建项目的 node 版本和 npm 版本,最好不要使用这种方法,因为你不能保证每次都有效,这种方法会引起后续很多包冲突需要一个一个的解决。这个问题,是因为npm程序执行到未知流程节点中然后没有调用回调通知任务已执行完成,导致进程异常退出,据官方说法他们也没有太好的方式解决,建议直接升级npm版本!记录了,说明解决了这个作者当时的问题,但是我是用这种办法,并没有解决,依然报错!目前还是没有解决我的问题,崩溃了,快!
2024-10-30 09:28:30
5057
原创 【解决 node】 ---- TypeError [ERR_INVALID_PROTOCOL]: Protocol “https:“ not supported. Expected “http:“
报错就是因为没有根据实际的开发引入对应的模块,还是写 node 脚本太少导致的不熟悉。
2024-10-23 17:30:01
429
原创 【react 和 vue】 ---- 实现组件的递归渲染
其实实现没有什么难度,主要是之前没有遇到类似的需求,因此觉得挺有趣的,记录一下实现的过程。我这里单纯的实现的纯展示组件,如果需要事件和其他的,就需要在处理其他的问题。
2024-10-23 10:36:21
807
原创 【Python实战】---- 爬取王者荣耀的所有英雄头像
前几天使用uniapp 实现了一个《扫雷》游戏的小程序,最近又准备使用 uniapp 实现一个《连连看》或者《消消乐》的小游戏,但是在写的时候需要很多图片,由于我本人虽然已经是三十五岁的手残党了,但是没事的时候,还是偶尔会王者几把娱乐娱乐,因此就想到了下载王者的所有英雄头像,来作为实现这个游戏的图片资源,图片只用于自己开发项目,于是就去官网查看现在王者有多少英雄,进行下载,结果去官网一查看,已经120多个英雄了,这要手动一个一个保存,这怎么是一个程序员做出来的事情呢?不是显得我不是一个专业的程序员?
2024-10-21 14:23:03
127
原创 【Python实战】---- 自动生成前端项目图标管理文件
方法很简单,实现的功能很简单,但是它减少了我的维护成本,我后边只需要将蓝湖中的图标下载下来,放到目标文件夹下,执行脚本,就能得到项目中使用的图标管理文件。后期上微信小程序时,将图片上传到服务器也好维护,直接在导入图片地址哪里调用上传接口,然后将返回的图片地址换为导入图片地址,这样只需要修改一个地方的代码,再执行脚本,就能将所有图片地址切换到服务器地址,是不是比前边的方法方便了很多,也不需要人为的去替换,解放我们的双手。哈哈哈!
2024-10-21 09:43:18
278
原创 【Python 错误解决】 ---- SyntaxError: (unicode error) ‘unicodeescape‘ codec can‘t decode bytes in position
这个错误是由于Python解释器在解析字符串时,遇到了无法识别的Unicode转义字符。在Python中,字符串字面量可以使用Unicode转义序列来表示特殊字符,例如\uXXXX表示一个16位的Unicode字符。但是,如果这个转义序列不完整或者不正确,Python就会抛出这个错误。使用原始字符串:您可以在字符串前面加上r来使用原始字符串,而不是使用常规字符串。正向斜线:如果你的文件系统支持,你可以使用正向斜线而不是反斜线。双反斜杠:另一种选择是使用双反斜杠来避开反斜杠本身。
2024-10-08 16:15:48
10071
2
原创 uniapp 游戏 - 使用 uniapp 实现的扫雷游戏
逻辑实现其实不是很难,最主要的是需要理清逻辑,然后按部就班的实现就可以了,写代码实现很重要,不要永远在思考的层面。由于这个是按照 PC 实现的界面,所以在移动端游戏界面会超出视图,因此可以在此基础,将难度在一个页面选择,然后动态计算每个难度格子的大小。ow - 1, 0);srow++) {scol++) {### 15. 总结1. 逻辑实现其实不是很难,最主要的是需要理清逻辑,然后按部就班的实现就可以了,写代码实现很重要,不要永远在思考的层面。
2024-10-08 10:32:00
1049
原创 错误解决 ---- Unexpected lexical declaration in case block no-case-declarations
第三方的文档是在他的环境下进行验证的,代码放到我们自己对接的环境,需要我们适配,解决可能存在的报错处理;报错不可怕,只要一步一步的找到报错的原因,查找报错的原因,解决报错,其实每次报错都是一次积累,至于积累的多少,就看你对每次报错解决的深度,不要羡慕那些一来就能决绝错误的人,他只是比你更加有解决错误的经验而已。认真面对自己的每一个报错,经常总结,你总会有一点点的进步。
2024-09-27 15:43:29
672
使用 uniapp 实现的《扫雷》游戏
2024-10-23
uniapp 基于 vue3 开发的【验证码输入框】
2024-04-11
批量修改文件名和将txt转excel
2022-06-08
python 批量将xlxs文件中的base64转成png图片
2022-05-07
python ---- 批量图片压缩工具
2021-02-24
原生js ---- 九宫格和转盘抽奖插件
2018-12-05
微信小程序----高德地图API实现的DEMO
2018-02-07
原生js ---- showdown制作的Markdown在线编辑器
2017-11-15
微信小程序 ---- 导航栏随滚动透明渐变
2017-11-08
mui ---- 搜索列表自定义
2017-11-03
原生js ---- ueditor富文本编辑器实例
2017-10-17
原生js ---- 二维码生成器demo
2017-09-19
原生js ---- 二维码解析器和移动端长按识别二位码demo
2017-09-19
原生js ---- HTML5中canvas制作的在线取色器
2017-09-11
通过sql筛选excel数据
2022-11-15
jquery的滚动监听事件
2017-06-21
TA创建的收藏夹 TA关注的收藏夹
TA关注的人