- 博客(47)
- 问答 (1)
- 收藏
- 关注
RSS订阅原创 Vue3源码(runtime-dom/core相关，teleport，provide/inject，生命周期函数，keepalive等)
传送组件，通过to属性指明传送的位置创建一个Teleport对象在创建虚拟DOM的时候，处理teleport情况在patch函数中修改默认分支处理修改Teleport对象中的process方法teleport卸载的时候也是在Teleprot类中创建一个卸载方法修改unMount卸载方法，vnode.type即Teleport对象。
2025-07-10 08:44:54
584
原创 Vue3.4源码runtime-dom,runtime-core相关(h函数，render函数，diff算法，插槽，props，emits)
runtime-dom用于浏览器渲染，基于runtime-core实现跨平台，而此包基于reactivity实现响应式处理。创建响应的packages包并安装给runtime-dom创建节点相关的配置文件nodeOpts创建属性相关的操作文件patchProp在createRenderer中使用，测试配置项是否可以正常使用然后创建render方法然后将createRenderer函数提取到runtime-core包中。
2025-06-30 08:01:55
1026
原创 Vue3.4源码解析(reactive,effect,ref相关,computed,watch)
,{console.log("自定义调度器");})){_effect.run() //fn中依赖的数据改变了，重新执行})_effect.run() // 默认执行const runner = _effect.run.bind(_effect) //用户主动调用此时因为外部没有主动调用run方法更新视图，所以视图未更新。
2025-06-17 09:12:30
434
原创 LogicFlow自定义使用
方法中用于初始化的时候挂着节点，同时在h函数中也初始化添加了props属性。因此在自定义节点组件中可以使用。安装相应的库，第二个引入控制画布缩放，历史前后退等功能。中还用于节点更新的时候，重新给组件传递自定义属性值。方法用于读取对应节点的properties属性值。（开始节点和结束节点的自定义组件未写）当把宽高设置很大的时候查看效果。顶部创建一个添加节点操作区域，下面两个代码用于设置描边范围。
2024-11-20 11:28:18
980
原创 react18+react-transition-group实现路由切换过度
原先项目中我的nodeRef引用是放路由表中每一项，然后每次进入页面的时候，遍历路由表取当前路由的nodeRef属性，这次我发现直接创建nodeRef就可以（原先是想每一个路由进入创建唯一的一个ref实例），这里必须有ref，否则控制台报错。
2024-10-13 12:47:21
524
原创 react+ts+vite 别名一直爆红问题
并且tsconfig.json中配置了如下解析还是报错，同时没有别名提示。测试可以解决别名不提示，和@引入一直爆红的问题。给如图两个json中添加相同的别名配置如下。已经配置如下代码安装了。
2024-10-12 20:34:27
787
原创 流程 设计
实习做这个功能的时候没头脑思路，现在学会了就记录一下完成的过程。下面是效果图整体采用链表的数据结构搭建，每一个节点就是如图所示的内容，每一个节点包含自身的描述信息，包含子项child的信息，整体渲染方式采用递归子组件完成。默认情况下就存在两个视图节点，即开始和节数节点，对应的数据结构如下。后期查找父子级关系的时候采用id和pid去维护。
2024-08-09 16:27:38
945
原创 vue3+vite按需引入element-plus icons
正常安装官方指定的插件包，下面是一个按需引入element-plus组件和字体图标的配置。然后模版中使用的时候需要如下方式，有点像Iconify，所有的字母之间均是。线连接，首字母小写拼接。
2024-07-26 13:15:13
347
原创 electron基础使用
代码签名是一种可用于证明桌面应用程序是由已知来源创建的安全技术。Windows 和 macOS 拥有其特定的代码签名系统，这将使用户难以下载或启动未签名的应用程序。代码签名在。
2024-06-11 20:37:11
1642
原创 Vue2+Vue3知识补充
一个对象默认的配置规则参数如下，通常都是为true。通过方法查看当使用定义一个对象中已经存在属性的配置项时。如果没有重新定义配置，那么还是以之前的配置参数为主。但是，如果往一个对象身上，使用定义一个原本不存在的属性，那么默认的配置信息通常都是false如果存在一个数组，这时候需要写一个公共的方法，那么会写到数组的原型身上。但是for/in循环会将自身的和原型身上可枚举的属性都处理。这就会造成了循环的时候将函数打印出来。会造成别人使用forin循环的时候出现不可预测的问题正确做法应该是这样子，
2024-06-11 20:36:41
845
原创 解决electron设置透明背景后，引入element-plus样式问题
app.vue文件中引入使用，这个时候会出现一个问题，el-button按钮的hover样式没有了，同时绑定的点击事件也无法触发。添加如下代码，则按钮的hover样式可以正常触发。首先给当前窗口设置自定义窗口以及背景色。然后自定义一个头部并引入。
2024-06-11 10:26:52
782
原创 tinymce富文本编辑器使用
当前项目中富文本是放在一个dialog中，因此部分样式会有层叠问题，该组件样式部分不添加。这里图片上传只是前端静态数据展示收集。
2024-05-29 14:32:02
439
原创 React基础原理实现
上面的代码是进行初始化渲染操作，涉及到更新或者删除的时候，将在 render 函数上收到的元素与我们提交给 DOM 的最后一个fiber树进行比较。因此，我们需要在完成提交后保存对“我们提交到 DOM 的最后一个fiber树”的引用。修改代码如下，当render函数初始化工作单元后，浏览器会在空闲的时候自动去执行workloop函数，在函数内部去执行performUnitOfwork函数。函数组件的话，不需要创建DOM结构，数据是来自函数的返回值添加到函数组件的父DOM结构中。属性，记录上一个fiber。
2024-03-20 22:29:06
756
原创 casbin
subject是sub的访问实体，object是obj访问的资源和action是act访问方法，eft是策略结果，一般为空，默认指定allow，还可以指定deny。
2023-11-29 15:44:57
1900
原创 常见数据结构例题
算法的稳定性是当两个相同的值出现的时候。在排序过后，是否还能保持原来的相对位置。选择排序每次找出最小的值放到起始位置 int[] arr = {5, 3, 6, 8, 1, 7, 9, 4, 2}; int temp = arr[0]; for (int i = 0; i < arr.length-1; i++) { int minPos = i; for (int j = i + 1; j &l
2023-11-14 14:17:10
244
原创 常见数据结构和算法（Typescript）
线性结构由n个元素组成的。常用的线性结构有：线性表，栈，队列，双队列，数组。数组的内存是连续的，因此在知道下标的情况下，访问效率是很高的。（早起JavaScript的数组内存实现并不是连续的。
2023-11-14 14:17:00
556
原创 git使用
设置用户签名git init，会在某一个目录下面初始化一个.git目录，用于管理当前git项目所有的代码必须先提交到暂存区后，从暂存区中再次提交到master中才会被赋予历史版本号。
2023-11-14 14:15:41
54
原创 前端技巧--笔记2
/</</</</</设置完成后如图，然后创建一个动画应用给span元素添加alternate是为了让文字熄灭的时候可以交替切换颜色，而不是瞬间回到初始值开始变化这个时候只需要设置每一个span元素动画的延迟时间即可。
2023-11-14 14:15:16
326
原创 React基础知识--6
给Demo按钮添加一个异步按钮，注意标识上进行了SAGA处理。第二个按钮执行的时候，第一次进入reducer中不会执行任何操作。但是会跟saga中的匹配。
2023-08-09 16:53:31
338
原创 知乎日报项目下--React
在baseReducer问中，对派发标识进行处理，负责用户数据的初始化和删除在baseAction中实现派发的具体代码，需要使用到redux-thunk中间件然后在Login组件中引入react-redux提供的connect方法使用store中的数据，最终props的内容如图解构出需要的内容控制台成功输出，state中获取到了用户数据在登录成功后，需要处理跳转的逻辑有几种情况。/loginto在登录页的props属性中结构出地址中的search参数，修改原先登录的跳转代码。
2023-08-01 19:13:03
312
7
原创 React基础笔记--5
是PC端处理路由的解决方法，与之对应的还有移动端的路由适配处理。当代前端开发主要以SPA单页面开发为主。那么单页面和多页面的区别是什么？如图，其中SPA不适用于SEO优化，因为大部分SPA都是基于，这就会导致查看源代码的时候缺少很多信息，而SEO优化恰恰是需要从源代码中获取部分信息来优化。但是还有一种服务端渲染，在服务端处理的时候就将整个页面数据全部渲染完成直接返回给前端，而前端直接使用这个页面即可，在这个页面中包含了几乎所有的源代码信息，因此利于SEO优化。
2023-07-23 22:57:17
402
1
原创 前端技巧--笔记1
console命令有关console.table()使用console.table()可以将一些网络请求获取的数据以表格的形式展现出来方便调试。比console.log()更直观。console.group(),groupEnd(),groupCollapsed()可以使用group()和groupEnd()快速打印一个分组信息。使用group()打印的分组信息默认展开。 而使用groupCollapsed()默认将分组折叠显示 let label = 'Package' cons
2023-07-14 08:46:19
379
1
原创 React基础笔记--3
封装一个自定义函数的普通命名都是以use起头命名。在这里我们尝试封装一个hooks函数可也实现部分状态更新，因为在之前我们已经测试过了useState无法支持部分状态更新，因此我们需要自定义实现。//函数组件主体代码 let [ state , setPartialState ] = usePartial({supNum : 10 , oppNum : 5 }) // 按钮点击的公共函数 function handle(type) {
2023-07-12 16:25:16
299
1
原创 React基础笔记--1
在默认环境下，脚手架给我们安装的是预编译语言，我们可以替换。步骤如下：先移除旧的预编译器npm i less和：安装less预编译，注意版本不能太高，否则不兼容。
2023-07-01 20:50:04
1061
原创 Vue3小兔鲜 - 下
在Element plus表单组件中内置了一些简单的校验规则，如上面的代码就是。像这种简单的校验只需要调用提供的配置项即可。如果想定制一些特殊的校验规则就需要采用自定义校验规则，其有对应的验证格式。自定义校验规则依旧是在表单的校验对象中完成。添加一个新的字段，负责处理勾选时候的逻辑同时绑定自定义校验规则。//callback不论成功或失败都需要调用 } }// 自定义校验规则 validator :(rule , value , callback) => {
2023-06-25 17:26:24
419
2
原创 Vue3小兔鲜--上
create-vue，即官方的项目脚手架工具，提供了搭建基于 Vite 且 TypeScript 就绪的 Vue 项目的选项。当创建vue应用的时候需要注意：npm init vue@latest该指令会安装并执行create-vue。vue3推荐使用volar插件，格式化的时候需要设置该插件为默认格式化工具。且需要把vue2的vetur关闭。 "[vue]": { // "editor.defaultFormatter": "octref.vetur" "editor.defaul
2023-06-19 08:26:03
573
原创 vue-网易云音乐笔记
后台搭建直接将代码包安装到自己的项目中，后台文件包。1.npm install安装依赖包2.node app.js运行出现以下结果代表运行成功rem实现由于采用的是移动端的项目，所以会语句视口适配的问题，在这里采用rem适配，但是采用rem适配的时候需要配置文件信息。在public目录下创建一个js目录并添加rem.js文件，代码如下function remSize() { // 定义设备的宽度,在iphone6中，宽度为375 let deviceWidth = document
2023-06-12 10:16:58
904
1
原创 Typescript笔记
typescripttypescript的一个特征就是静态类型检测。在JavaScript中，需要将代码运行到浏览器中才可以查看报错结果。在typescript提供的编译环境中发现，在编写代码的阶段，就直接给出下划线错误提示信息。typescript会对错误的拼写,函数未调用，逻辑错误等进行检测。typescript基本认识安装typescript:npm i typescript -g创建一个1.ts的文件并添加代码。发现如果在编写代码环节就出现了某些错误，那么会直接给出错误的提示信息。
2023-06-03 15:47:10
860
原创 千峰--企业新闻发布管理系统--下
在web展示页面，不涉及到路由权限控制，所以不进行配置创建项目文件结构和admin文件一致，这里就省略了。这里对于前端的显示页面只有3个部分需要使用到vue-rouoter控制。在路由配置文件中配置相关代码这个时候可以在前端页面给用户增加体验，每次切换路由的时候会显示一个进度条效果在路由进入和退出之前调用对应的进度条显示方法。
2023-05-14 18:32:10
242
练习的项目里怎么通过点击去支付弹出，支付方式页面
2022-12-03
less里面怎么使用nth-child选中想要的标签设置样式
2022-12-08
css写两面翻转遇见的问题
2022-11-23
3D转换实现两面翻转
2022-11-23
以16位计算机为例，定义一个long int a
2021-10-26
TA创建的收藏夹 TA关注的收藏夹
TA关注的人