- 博客(48)
- 收藏
- 关注
原创 Vue3响应式原理(源码)【reactive,ref,computed】
Vue 3响应式系统基于Proxy重构,核心包含reactive、ref和computed三大模块。通过Proxy拦截对象操作,结合WeakMap存储依赖关系,实现高效的依赖收集(track)和触发更新(trigger)机制。系统采用副作用函数(effect)自动追踪数据变化,计算属性(computed)实现懒计算和缓存优化。相比Vue 2,新架构支持数组变化监听和对象属性增删,性能更优且功能更全面。核心流程包括:Proxy代理原始对象→访问数据时收集依赖→数据变更时触发更新→执行相关副作用函数。
2025-12-25 15:12:19
686
原创 多个滑块的信号条的实现
本文介绍了一个信号强度选择器的实现方案。该组件包含一个信号轴(-85至-30范围),轴上分布三个可拖动滑块(红、黄、绿分别代表差、中、好信号),滑块将轴分为四个颜色区域。实现要点包括:使用flex布局渲染四段不同颜色的轴;滑块采用百分比定位并支持拖动;处理滑块值和百分比显示的重叠问题;当鼠标悬停时会显示当前信号值标记。关键算法涉及计算各段宽度百分比、滑块位置转换,以及碰撞检测处理文字重叠情况。组件通过Vue实现响应式更新,确保滑块顺序和颜色区域同步变化。
2025-07-30 16:28:17
588
原创 AI对话命令下发
本文档分析了AI对话命令下发功能的实现方案,基于Vue 3+Composition API技术栈。核心功能包括消息列表管理(区分用户/机器人消息状态)、异步消息收发处理(含错误提示)、命令执行与结果展示(支持多状态和展开收起)、自动滚动机制等。技术难点集中在动态消息渲染、异步状态同步和执行结果展示上,通过对象属性控制、try-catch处理和CSS样式裁剪等方案解决。文档同时指出待优化的性能问题(长列表卡顿)和代码组织结构(业务逻辑抽离)等改进方向。
2025-07-23 11:00:04
501
原创 AntV_G6实现UI树
目前需要实现一个 UI 树,用于展示设备树,以及设备树中设备的属性。与树状列表不同,UI 树需要有特定的交互方式,支持边以及当前节点的点击事件,那就用G6进行是先把。
2025-03-10 13:46:18
796
原创 HDialog特殊动画效果
在开发过程中直接使用HDialog所展现的效果很快,同时不能够与用户所点击位置进行交互,会造成用户的体验观感不够好。因此需要实现一种能够从用户点击按钮位置以可变动画效果所展现的Dialog效果。
2024-07-30 17:10:23
498
原创 数据结构(王道)链表部分
数据结构(王道)链表部分习题代码实现#include <bits/stdc++.h>int main(){}//删除所有值为x的结点void deleteAllDataIsX(SqList &head,int x){ Lnode *p = head->next; Lnode *pre = head; Lnode = *q; while(p!=null){ if(p->data == x){
2021-03-31 16:39:42
364
原创 反转链表
反转链表题目定义一个函数,输入一个链表的头节点,反转该链表并输出反转后链表的头节点。示例:输入: 1->2->3->4->5->NULL输出: 5->4->3->2->1->NULL来源:力扣(LeetCode)链接:https://leetcode-cn.com/problems/fan-zhuan-lian-biao-lcof讲解对于此题主要是反转,那么一开始的head节点肯定是NULL,那么首先定义一个pre节点为NUL
2020-11-11 22:46:16
187
原创 寻找节点最大最小值
寻找最大节点和最小节点题目描述如图所示,平台10个节点ID号随机,左上角,右下角节点已知,左上角,右下角节点作为数据接受节点,参赛队需编写其他12个节点的代码,左上角节点打印最大的三个节点,右下角节点打印(printf)最小的三个节点。问题解析本题主要使用CTP节点技术,因为是0号节点与1号节点进行数据接收节点,因此第一想到的应该就是CTP协议,同时CTP协议中包含数据分发协议,分发协议也是必须的,本题主要使用这两个协议。.h代码解析对于此题肯定是需要一个数组进行对所有的节点进行数据保存的,
2020-11-04 15:16:07
558
原创 前端面试笔记
第一章关于JS里面的substr函数的参数是substr(beginIndex,length); //length是从开始后的多少长度JS中的typeof操作符中能反映除的数据类型有:number,string,object,boolean,undefined,function.e.g:typeof(null) => object重点:关于声明变量有var和没var的区别:有var声明的是局部变量,而没有var声明的是全局变量js中定义参数不可以 以数字开头var
2020-11-04 13:20:34
182
原创 leetcode(面试题 02.02. 返回倒数第 k 个节点)
一.蠢办法(使用循环进行查找)var kthToLast = function(head, k) { var dummy = new ListNode(0); dummy = head; var length = 0; while(dummy!=null){ length++; dummy = dummy.next; } console.log("长度为:"+length); var buchang = 0;
2020-10-13 13:35:31
138
原创 Node.js文件写入与删除,buffer基础操作
一.文件写入let fs = require("fs");// 这里德flag参数为比较重要德参数,但同步会直接变成回调地狱,就很恐怖,因此需要使用异步进行封装fs.writeFile( "test.txt", "吃吧!?", { flag: "a", encoding: "utf-8" }, (err) => { // console.log(err); if (err) { console.log("内容出错"); } else {
2020-10-11 22:45:28
951
原创 关于NodeJS的文件读取
var fs = require("fs");// 导入文件模块// node,读写文件有同步与异步的接口,我们重点使用异步// var fd = fs.openSync('hello.txt','r');// console.log(fd);// 同步=>等待和阻塞// var buf = Buffer.alloc(20);// var content = fs.readFileSync(fd);// 异步fs.readFile("hello.txt", { flag: ".
2020-10-06 16:33:54
361
原创 Leetcode环形链表
题目:题目在此给定一个链表,判断链表中是否有环。如果链表中有某个节点,可以通过连续跟踪 next 指针再次到达,则链表中存在环。 为了表示给定链表中的环,我们使用整数 pos 来表示链表尾连接到链表中的位置(索引从 0 开始)。 如果 pos 是 -1,则在该链表中没有环。注意:pos 不作为参数进行传递,仅仅是为了标识链表的实际情况。如果链表中存在环,则返回 true 。 否则,返回 false 。进阶:你能用 O(1)(即,常量)内存解决此问题吗?示例 1:..
2020-09-26 18:21:20
133
原创 约瑟夫问题(Java环形列表实现)
package linkedList;public class Joseph { public static void main(String[] args) { CircleLinkList cir = new CircleLinkList(); cir.addBoy(15); cir.getAllInfo(); cir.countBoy(1, 2, 15); }}// 创建环形的单向链表class CircleLinkList {// 创建一个first检点 pri.
2020-09-22 21:07:58
525
原创 js实现抽奖程序demo
<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>day16</title> </head> <style type="text/css"> * { margin: 0; padding: 0; } #box1 { height: 500px; background-color: #9ACD.
2020-08-03 20:57:50
579
原创 leetcode零矩阵
题目:编写一种算法,若M × N矩阵中某个元素为0,则将其所在的行与列清零。var s = function(m) { // var arr1 = m; var hang = m.length; // console.log(hang); var lie = m[0].length; // console.log(lie); var hang1 = new Array(); var lie1 = new Array(); // console.log("!!!!!.
2020-07-27 01:26:01
236
原创 JS正则表达式
正则表达式test方法,检测是否含有符合正则的字串,如果有的返回true,反之为false 修饰符 /g,匹配全局 /i 忽略大小写 search方法:查找符合规则的字串的位置(只返回第一个匹配到的字串的位置) split方法:以特定的字符进行分割(与字符串的方法相同) replace方法,replace(正则表达式,替换的字符串) exec方法:将匹配到成功的内容进行返回,如无匹配返回null 特殊字符".":除了换行符的其他所有单个字符 "*":重复多次匹配,匹配任..
2020-07-17 17:00:47
144
原创 关于JavaScript的默认行为与DOM2级事件(包含事件流)
事件流: 捕获(从外到内) 目标 冒泡(从内到外) 阻止冒泡方法 e.stopPropagation() 默认事件 浏览器<a>标签点击后默认刷新 form表单点击提交按钮后默认刷新 鼠标右键页面默认弹出菜单选项 阻止默认行为<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>...
2020-07-15 17:26:44
210
原创 PS的快捷键(7.14)
PS的快捷键(部分)复制图层:Ctrl+j取消选择:Ctrl+D删除选区:选中选区Delete删除图层:选中图层Delete恢复到上一步:Ctrl+Z放大缩小图片:Alt+鼠标滚轮抓手移动图片:空格+鼠标左键增加图像选区:按住Shift+划选区减少选区:按住Atl+划选区相交选区:Shift+Alt+划选区填充为前景色:Alt+delete填充为背景色:Ctrl+delete快速选择工具大小调节:Alt+鼠标右键,左右拖拽...
2020-07-14 00:21:07
523
原创 关于第二个功能得实现(详细解释)+云开发
(先把这个图摆出来,就是这个垃圾分类信息)一.外观样式+wxml(第一件事:当然是需要你进行登录授权,否则是不可能让你使用此功能得)=>(在js中讲述)页面已经出现了,那么进行布局分析1.标题栏:上面不同于首页的智能垃圾桶,而变成了信息查询,这里的实现在:{ "usingComponents": {}, "navigationBarTitleText":"信息查询" }这里的"nacigationBarTitleText"为标题栏的内容,是在json文件下的进行
2020-06-08 23:51:30
262
原创 对于小程序的学习1(自我实现一个demo)
(这是页面的首页)一.智能识别关于智能识别,大家可以想想看是什么技术,这个是我的一个项目,因此在对后期,技术团队会给我提供硬件的接口进行调用。但是目前我也可以调用相机进行扫码识别,这里使用到的是微信自带的一个接口:wx.scanCode(详情请到微信小程序文档自行查看),我贴下示例代码:// 允许从相机和相册扫码wx.scanCode({ success (res) { console.log(res) }})// 只允许从相机扫码wx.scanCode({ on
2020-06-07 01:36:37
184
原创 Vue的动画效果(自定义类)[animate.css]
<!DOCTYPE html><html> <head> <meta charset="utf-8"> <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script> <link rel="stylesheet" href="ht...
2020-02-21 23:51:59
619
原创 Vue的动态组件与v-once功能介绍
<!DOCTYPE html><html> <head> <meta charset="utf-8"> <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script> <title>test</title> &...
2020-02-21 00:09:44
330
原创 Vue的插槽
<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>vue使用插槽</title> <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>...
2020-02-21 00:07:32
131
原创 vue关于非父子组件的传值问题
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <!-- <script src=...
2020-02-19 22:52:58
180
原创 计算机网络(DAY1)
关于查看木马,在启用管理员权限的windows powershell可以进行相关的查询,输入命令 netstat -nb就可以看见各个的参数,是什么在执行,方便给找出木马 同样也是在powershell,可以通过命令 netstat /? 来进行相关指令的查询OSI参考模型应用层 所有能产生网络流量的程序 表示层 在传输之前是否进行加密 或 压缩处理 二进制ASCII码值 会话层 ...
2020-02-12 21:50:08
175
原创 小白学习Vue(7)---创建组件(组件的data)
一.简介今天,肺炎已经开始好转了,新增人数在不断的下降,所以我觉得,只要坚持,没有什么事过不去的,包括学习,积少成多,知识一定可以积累上去的。2020.2.11今天其实学习状态不怎么样,但是还是学了前端框架和每日英语,但是对于数据结构和计算机网络的学习就咕咕咕了,今天都是被游戏害的,哎嘿嘿。二.代码<!DOCTYPE html><html> <...
2020-02-12 00:00:14
238
原创 (数据结构)——顺序表和链表的比较
一.基于空间的比较1.存储方式的比较顺序表的存储空间是一次性分配好的了,而链表的存储空间是多次分配的。2.存储密度(节点值域所占存储量/节点结构所占的存储总量)顺序表的密度是等于1的,而链表的密度是小于1的二.基于时间的比较1.存取方式顺序表可以随机抽取,也可以顺序抽取;但是链表只可以顺序抽取(读取第n个元素,那么就必须遍历其之前所有元素2。插入和删除的不同顺序...
2020-02-10 20:56:30
1200
原创 小白学习Vue(6)---Vue动画
一.代码<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>action</title> <!-- <script src="./lib/vue.js"></script> --> <scrip...
2020-02-10 17:47:18
111
原创 leetcode 各位相加
给定一个非负整数 num,反复将各个位上的数字相加,直到结果为一位数。示例:输入: 38输出: 2解释: 各位相加的过程为:3 + 8 = 11, 1 + 1 = 2。 由于 2 是一位数,所以返回 2。进阶:你可以不使用循环或者递归,且在 O(1) 时间复杂度内解决这个问题吗?解法:其实这道题是非常简单的,但是恕我无能,我也是看了一眼题解比如一个三位整数可以...
2020-02-07 15:48:56
213
原创 leecode整数反转
一.题目描述示例 1:输入: 123输出: 321示例 2:输入: -123输出: -321示例 3:输入: 120输出: 21注意:假设我们的环境只能存储得下 32 位的有符号整数,则其数值范围为 [−231, 231 − 1]。请根据这个假设,如果反转后整数溢出那么就返回 0。二.方法因为2二十三次方等于0x7fffffff,负数那个是0x8...
2020-02-07 13:28:10
176
原创 样式表的增删查找(小白学习Vue 6)
一.介绍今天是2020.2.6,我最近已经不看关于肺炎的相关报道了,不过好像已经有好转的迹象了,我这边也是有了一例患者,我希望他能够早日健康。对比于昨天,我今天大概一天都在学习前端的Vue框架了,花了差不多5个小时做了一个项目,就是所谓的样式表的一些功能,但是不推荐使用DOM元素,那么久必须应用到Vue的一些方式咯!二.代码这次这个代码写的非常的详细,具体的功能我都有一些注释,就是代码...
2020-02-07 00:08:04
163
转载 ES6的规范性
1.let 和 const暂时性死区 (Temporal Dead Zone)let和const命令声明的变量无变量提升,且都会被锁定在声明的代码块中,在let和const命令执行前,使用该变量都将报错,这一部分称为“暂时性死区”。var tmp = 123;if (true) { tmp = 'abc'; // ReferenceError let tmp;...
2020-02-06 19:42:13
189
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人
RSS订阅
2