- 博客(127)
- 收藏
- 关注
RSS订阅原创 HTML 拖放API
draggable属性可用于DOM标签，设置为true表示可以拖动，为false表示不可以拖动。其false和true必须显示设置，不能省略。（以vue3代码为例）
2025-12-25 16:08:56
137
原创 css 练习笔记1
设置成preserve-3d的时候，可以把父元素空间想象是一个3D空间，父元素变形效果和子元素变形效果可以存在空间关系。设置成flat的时候，可以看成父元素内部空间是平面的，子元素和父元素的动画效果都在同一个平面。表示 class b只有在b是定义在class a的后代元素上时才生效。设置父元素内部是3D还是2D。或者（scss语法）
2025-12-25 09:43:12
125
原创 前端 ResizeObserver API
ResizeObserver可以监视Element内容盒或边框盒或者SVGElement边界尺寸的变化。在调用时配置监控逻辑，并返回实例监控对象，通过监控实例对象绑定需要监控的DOM，当DOM尺寸变化时，触发监控逻辑。
2025-12-25 08:35:09
578
原创 vue3 状态管理器 pinia 用法笔记1
)setup风格配置函数的调用和配置对象一样，都是通过import引入定义的useCounterStore方法，调用后返回仓库实例对象store。
2025-12-24 09:32:27
263
原创 TS 模块/命名空间
对于某个ts类型文件来说，该文件内部的方法只能在文件内部使用，该文件即可具有一个或多个模块，模块内部的方法不在全局作用域中，外部不可见。如果想要在其他文件中使用ts文件中定义的方法，需要在ts文件中通过export导出，并在其他文件中通过import导入。用于全局类型声明，与普通的TS类型语法类似，只不过在类型声明语句前加一个declare，类型声明即可全局生效。命名空间定义了标识符的可见范围，一个标识符可在多个命名空间中定义，它在不同命名空间中的含义是互不相干的。外部模块/模块：从外部引入的模块。
2025-12-22 16:55:18
210
原创 react antd form表单基础使用笔记1
表单数据提交有两种方式，一种是使用Form.Item在Form表单中添加提交按钮，另一种是在Form表格外面触发提交事件，在提交事件中调用Form表单的提交方法。这种方案的逻辑是，通过Form.Item提交按钮，触发表单的初步提交，表单进行数据校验，校验成功后进入onFinish，在onFinish中进行提交要进行的逻辑。校验通过Form.Item上的rules控制，设置校验规则后，如果进入提交逻辑，会自动进行校验，若校验不通过，不会进入后续提交逻辑。在表单外通过其他事件触发表单的提交逻辑。
2025-12-22 08:08:51
294
原创 datagrip 连接达梦数据库
然后在新建的Project Data Sources里，填写账户名、密码，和链接URL。要创建class，本地导入驱动，选择Driver Files下面的+，会弹出来三个选项，选择第一个，本地JARs，然后选择本地的达梦数据库驱动。首先要添加驱动，点开软件之后，左上角是Database Explorer，下面有一排操作栏，点击+号，然后找到下面的driver。填好之后点击Test Connection测试是否连通，如果绿了点击OK就可以了。在这个页面最重要的是创建对应的class，其他的都可以不改。
2025-12-18 16:24:47
264
原创 React 动态显示icon
通过@ant-design/icons引入Icon大对象，通过Icon['icon名']获取对应的对象，在需要添加icon的地方调用React.createElement就可以显示icon。
2025-12-17 14:08:28
207
原创 TypeScript 学习笔记3 js类
想要定义一个类，可以使用两种方式，1.声明式2.类表达式类的声明式表达不具有提升，因此不管是使用声明式还是表达式，在定义之前都不能访问到类。
2025-12-16 09:21:49
269
原创 TypeScript 学习笔记2
interface（接口）的部分用法与type类似，但与type不同的是，interface用于定义对象的类型别名，同时，interface可以定义可选属性与只读属性，且interface定义的对象也可以被看做是类的一种规范，可以用来实现具体的类。有时，对于某个值，编码人员可能清除该值的详细信息，比如该对象上的某个方法等，但typescript会因为不知道其值，而在静态阶段对其进行报错。可以尽量少使用any。通过type 类别别名 = 类型 的形式，可以给类型起别名，在实际使用时，使用别名表示变量的类型。
2025-12-15 14:29:43
900
原创 Next.js 路由 简单学习笔记
页面路由在页面路由模式下，如果希望页面默认渲染自定义的组件，需要修改pages文件夹下的_app文件。路由对应的页面，会自动填充到Component的位置。而页面的props，默认是一个空对象。除非使用数据获取方法为页面进行预加载。应用路由在应用路由模式下，如果要创建共享的布局，需要修改app目录下的layout文件。layout会在{chidren}处渲染路由组件或者layout文件。
2025-12-03 15:53:04
496
原创 vue3 computed 练习笔记
会记这篇博客，其实主要是因为在实际项目拆分组件的时候，拆分的是一个dialog，而digloag绑定的v-model来源于父组件，props不能直接作为v-model，且由于传递的v-model是控制dialog是否显示的visiable，如果dialog关闭，visiable的值需要回传给父组件，因此需要用到computed的set和get实现。基础语法：在对象内部，使用get 函数，在访问对象.属性名时，会触发get对应的方法。语法将对象属性绑定到查询该属性时将被调用的函数。当尝试设置属性时，set。
2025-11-25 10:47:02
340
原创 TypeScript学习笔记1
TS是JS的扩展语言，是JS的超集，TS包含了JS的所有内容，再此基础上，TS增加了静态类型检查、接口、泛型等内容，在实际运行时，TS需要编译为JS，然后交给浏览器或其他的JS环境运行。
2025-09-21 23:29:51
812
原创 React useEffect 学习笔记
如果不是函数，会引发报错，也就是说，如果给回调函数添加async，这也会导致报错，因为async函数默认返回Promise，如果确实要使用异步调用，可以在useEffect内部定义一个函数，这个函数是async函数，然后再在useEffect内部调用这个函数。如果在每次useEffect调用时，不进行清除，由于useEffect内部操作是独立的，也就是说，useEffect内部的操作被看成独立的函数内容，每次调用都会重新执行一遍，并不会产生覆盖，那么每次调用时都会创建一次链接，造成多个链接。
2025-09-09 00:25:52
655
原创 Next.js学习笔记1 路由/layout/template
严格模式，在next.js项目中是默认打开的，但有时候严格模式会产生问题，严格模式在开发阶段，内部会模拟组件挂载卸载的过程，有时候，一个方法会被触发两次，如果觉得这对调试问题产生了影响，可以在next.config.mjs文件中配置关闭，但一般还是推荐打开。对于一个页面文件，文件内部也可以有自己的layout，在根布局的{children}内部，是自己页面的layout，文件夹中的页面会作为{children}嵌套在自己的layout中。文件里也可以有文件嵌套，内层文件也可以有自己的laylout。
2025-09-08 09:50:27
1024
原创 React 学习笔记5 ajax/兄弟组件传值/路由
前后端通信时，一般是并不同源的，为了请求能够处理（请求可以发送，服务器端也会响应，但是浏览器会丢弃这个响应），需要在React中通过代理（和前端同一端口开一个服务器，代理服务器和前端同源，代理服务器和后端服务器不存在跨域问题，因此可以进行交互）进行配置。在接收数据的组件里订阅消息，订阅消息使用PubSub.subcribe订阅，这个函数的第一个参数是消息名，第二个参数是消息发布时触发的回调函数，回调函数有两个参数，消息名和接收到的参数。后端会根据请求，找到对应的处理函数，返回响应的数据。
2025-09-08 09:19:30
614
原创 React 学习笔记4 Diffing/脚手架
如果在旧虚拟DOM中找到了与新虚拟DOM中一样的key，则可以确定这两个节点是同一个，如果虚拟DOM中的内容没变，则直接复用，如果虚拟DOM中的内容改变了，则生成新的DOM并进行替换。对于两个组件，如果他们各有自己的css文件，且css文件中存在冲突的命名，则后引入的样式会覆盖先引入的文件，为了避免这种情况，首先，要给css的名字之前先加上module，然后，在引入样式时，给引入的样式命名，然后给组件中标签配置样式时，配置命名.样式，就可以避免冲突。包含了基础的需要的配置，并且可以下载好所需的相关依赖。
2025-09-02 16:47:50
1116
原创 React 学习笔记3 生命周期 受控/非受控组件
在React，事件绑定通过on事件名（事件名首字母大写）的形式来进行绑定。React中使用的事件，是React重新封装的自定义事件，并不是原生DOM事件，这是为了更好的兼容性考虑。React的事件是通过事件委托的方式处理的，也就是说，DOM上绑定的事件会被委托给最外层的DOM。通过这种方式提升效率。事件回调函数具有参数event，因此也可以使用event.target获得事件对应的DOM。
2025-09-01 10:56:42
629
原创 React 学习笔记2 props、refs
在使用组件时，有时希望组件中展示组件定义外部的数据。在组件上有一个props属性，在通过类式方法定义组件时，可以在渲染组件时，在组件标签上添加属性，这个属性会以key value的形式放入props。
2025-08-25 16:21:38
799
原创 React 学习笔记1 组件、State
React是用于构建用户界面的JS库。React是由Facebook（Meta）开发的，是开源的。React采用组件化模式、声明式编码，可以提高开发效率，提高代码复用率。使用React Native，可以用React语法进行移动端开发，可以使用JS编写安卓和IOS应用，而不需要使用java oc swift。React使用虚拟DOM和Diffing算法，减少与真实DOM的交互。
2025-08-22 19:09:26
1125
原创 HTTP0.9/1.0/1.1/2.0
每次一个请求处理完成后连接不会直接断开，一次通信中，可以发送多个请求，不会反复发送TCP请求，没有不断建立和断开连接的开销。HTTP1.0中，使用短连接，当服务器返回数据之后，就会断开连接，每次发送请求，都要重新建立连接（三次握手）然后传输数据，然后再断开连接。一般请求都是客户端向服务器发起，但有了服务器推送，服务器端可以告知客户端还有信息要传输，客户端不关闭连接，而是待机等待。首部压缩/头部压缩：建立头部索引表，将传输过的头部存入表中，下次传输时，如果表中有这个头部，就传输索引号，否则传输请求头。
2025-08-17 23:52:13
229
原创 VUE3 学习笔记2 computed、watch、生命周期、hooks、其他组合式API
在vue3中，虽然也能写vue2的computed，但还是更推荐使用vue3语法的computed。computed是一个函数。它的参数接收一个函数，这个函数可以是普通函数，也可以是箭头函数，由于vue3中没有this，所以无需关注函数类型对this指向的影响。这个函数就是计算的方法函数。但是通过这种方式定义的计算属性，是只读的，无法对属性进行修改。如果计算属性同时需要读取和修改，要通过下面这种形式：传入computed的参数是一个对象，在对象中配置get和set。
2025-08-15 09:50:45
1487
原创 JavaScript 学习笔记1
如果通过new 构造函数()创建实例，实例的原型是构造函数的原型对象，而构造函数身上，除了有指向原型对象的prototype，由于构造函数也是Function的实例，构造函数身上也有指向Function原型对象的__proto__，而原型对象又是Object的实例，所以身上有指向Object原型对象的__proto__。变量类型，是指变量赋值后的类型，也就是变量内存值的类型，比如let demo = {}，给demo赋值的数据类型是对象，但是demo的类型不是对象，demo是指向对象的引用。
2025-08-12 10:08:57
1080
原创 JS深拷贝 浅拷贝、CSS垂直水平居中
浅拷贝，通俗来说，就是把一个对象obj1的属性值直接拷贝给另一个对象。不管这个值是普通的数据类型，还是引用类型。实现方法：1.使用Object.assign方法2.使用扩展运算符3.手写拷贝函数拷贝对象的属性与源属性共享相同的引用。当更改源对象或拷贝的副本时，可能导致对应的对象也发生更改。如果对象obj1是obj2的浅拷贝，obj1！==obj2成立。两个对象的属性有相同的名称且顺序相同、属性值相等、原型链相等。对拷贝的副本的顶层属性的重新赋值不会影响源对象；对拷贝副本的嵌套对象的重新赋值
2025-08-11 21:51:50
1001
原创 CSS优先级、HTTP响应状态码
优先级：看CSS的。行内样式/内联样式：直接在HTML元素的style属性中编写CSS样式。这种方式适用于少量样式的情况，但不推荐在大规模开发中使用，因为它会使HTML文件变得冗长和难以维护。用户important>用户样式>浏览器样式内联样式>内部样式表>外部样式表内部样式表：将CSS代码直接写在HTML文件的<head>标签内的<style>标签中。这适用于仅适用于单个HTML文件的样式，但不推荐在多个页面中重复使用。
2025-08-10 23:58:51
293
原创 node.js 学习笔记3 HTTP
path模块主要用于操作路径。要使用path，首先需要引入path模块。用于拼接规范的绝对路径。如果想拼接一个路径，有时候是使用字符串手动拼接的，但由于系统的规范不同，路径中的\和/无法统一，有时候手动拼接的字符串路径并不标准，path.resolve可以提供一种标准的绝对路径。path.resolve的参数是要拼接的路径。path.resolve中，相对路径可以省略./，但不能以/开头，以/开头的路径会被识别为绝对路径，作为根路径与其他路径参数进行拼接。获取操作系统的路径分隔符。
2025-08-10 20:02:09
929
原创 CSS BFC
文档中有三种流：普通流-块级元素、行内元素等普通标签。定位流-定义了position。浮动流-定义了float为left或者right。在实际开发中，这三种流之间可能会存在问题。比如margin重合。margin重合问题：如果两个div上下相邻，两个div同时设置了同一边的margin，margin会产生重合。比如上面的div设置了20px的margin-bottom，下面的div设置了30px的margin-top，两个div之间的margin并不是50px，而是会重合成30px。
2025-08-08 23:27:41
1174
原创 node.js 学习笔记2 进程/线程、fs
进行中的程序。比如有一段程序，程序已经载入内存了，CPU正在执行这段程序，这时候就会产生一个进程。进程，也可以看做程序的一次执行过程。在window中打开任务管理器，可以查看计算机中的所有进程。一个进程中执行的一个执行流。线程是属于某个进程的。一个进程中至少包含一个线程，可以有多个线程。比如进程A可能有一个线程a，进程B可能有线程a,b,c。线程也可以通过指令查看。pslist -dmx 进程ID。进程ID可以在任务管理器中查看。
2025-08-08 16:11:45
1100
原创 HTTP缓存机制
当前后端通信时，会互发HTTP报文，HTTP报文由header、start line、body组成。（header）允许客户端和服务器通过 HTTP 请求（request）或者响应（response）传递附加信息。
2025-08-08 10:49:11
904
原创 VUE2 学习笔记 合集
VUE2 学习笔记1 VUE特点、开发者工具、入门Demo-优快云博客VUE2 学习笔记2 数据绑定、数据代理、MVVM_vue2的数据绑定-优快云博客VUE2 学习笔记3 v-on、事件修饰符、键盘事件_vue2组件 点击事件-优快云博客VU2 学习笔记4 计算属性、监视属性-优快云博客VUE2 学习笔记5 动态绑定class、条件渲染、列表过滤与排序_vue2 :class-优快云博客VUE2 学习笔记6 vue数据监测原理_一-优快云博客VUE2 学习笔记7 v-model、
2025-08-05 20:28:23
422
原创 VUE2 学习笔记18 路由守卫
有时候，并不是所有的导航区都可以随意点击，需要具备某些权限，才能看到某些导航区对应的展示区。比如，希望用户在未登录的情况下，无法访问个人中心。这种效果可以通过路由守卫实现。路由守卫在VueRouter的实例对象上，通过beforeEach调用，beforeEach在每一次路由切换之前都调用一次beforeEach内部设置的函数。假设VueRouter实例为router，在路由配置文件中，通过router.beforeEach配置全局前置路由守卫。全局前置路由守卫在页面初始化、及每次路由切换前被调用。
2025-08-05 16:38:15
764
原创 VUE2 学习笔记17 路由
路由器：router，在日常生活中，路由器的一个接口可以连接一台设备，连接到路由器接口的设备可以上网。路由器可以管理多个路由。路由：route，是一种对应关系，对应某个地址和实际的设备或页面等，是一种key-value对应。在前端开发中，路由用于实现单页面应用。多页面：网站有很多个HTML，当显示不同的页面时，在多个HTML间进行跳转，通常要开多个页签。
2025-08-04 22:06:59
1025
原创 VUE2 学习笔记16 插槽、Vuex
在编写组件时，可能存在这种情况，页面需要显示不同的内容，但是页面结构是类似的，在这种情况下，虽然也可以使用传参来进行，但传参时，还需要编写props等逻辑，略显重复，而且数据的结构还需要是类似的，不能显示十分不同的数据，但可以用插槽解决这个问题。
2025-08-03 20:28:20
698
原创 VUE2 学习笔记15 代理
配置代理时，相当于在前后端交互时，有一个代理服务器，代理服务器和前端的端口号一致，当前端向后端请求数据时，不直接给后端发送请求，而是把请求发给代理服务器，代理服务器把请求转发给后端服务器，代理接收到后端服务器的数据时（由于代理服务器和后端服务器都是服务器，服务器之间通过HTTP请求通信，也不存在跨域问题），代理服务器把数据反馈给前端。思考一种情况，对于一个搜索列表，如果初始进入列表时，显示的是欢迎词，当搜索时，数据未返回时，显示的是加载画面，当数据返回后，显示的是数据列表，当数据请求失败时，显示错误信息。
2025-08-01 10:00:33
735
原创 VUE2 学习笔记14 nextTick、过渡与动画
可以通过这些数据调用第三方库。可以一开始就执行一次进入激活时的样式，通过appear属性控制，当绑定true时，表示一开始就激活一次，:appear="true"，也可以直接写appear，和:appear="true"的效果是一样的。一般来说，进入的起点和离开的终点样式是一样，而进入的终点和离开的起点是一样，因此写样式时一般写 .v-enter, .v-leave-to{}和.v-enter-to, v-leave{}。.v-enter-to{} 进入的终点，对应元素进入的动画完成时的样式。
2025-07-31 10:02:45
974
原创 VUE2 学习笔记13 本地存储、自定义事件、全局事件总线、消息订阅与发布
click、keyup等事件，是Vue内置的事件，而Vue也支持开发者自己自定义事件。绑定自定义事件在标签中，如果想设置自定义事件，要以v-on:自定义事件=“自定义事件要触发的methods”的形式进行。但是，与内置的click事件不同，自定义事件没有设置的触发条件。那Vue如何决定何时触发自定义事件呢？触发自定义事件，需要通过一个方法主动触发，它是this.$emit方法，语法是this.$emit(要触发的自定义事件，触发事件时传给methods方法的参数)。
2025-07-31 00:21:49
776
原创 VUE2 学习笔记12 ref、父子组件传参、mixin
要注意，在父子组件传值的过程，如果key:value不是使用绑定变量的形式，而是使用固定的写在标签上的value传递，那么value值默认是字符串，对字符串进行加操作，会进行字符串拼接。中部列表框，列表显示已经有的TodoList列表，列表内部还有一个子组件，这个子组件控制每条列表数据；在对组件进行复用时，有时候，不同地方的组件，需要显示某些不一样的信息，这就可以通过父子组件传参来进行操作，在父组件使用子组件标签时，传入父组件指定的数据，子组件显示父组件传入的数据，这个功能可以通过props实现。
2025-07-30 08:23:45
965
原创 VUE2 学习笔记11 脚手架
Vue的js文件由Vue核心和Vue模版解析器构成，Vue模板解析器的代码体积并不小，如果Vue不提供非完整版的Vue，在项目打包之后，打包生成的文件中也含有Vue的Js文件，并且这个文件也是由Vue核心和Vue模板解析器构成，而且，由于文件已经打包完成，并不需要Vue模板解析器了。Vue最终会把Vue.config.js文件输送给Webpack，Webpack基于Node.js，Node.js的模块化是基于Common.js，因此在Vue.config.js中，也使用Common.js语法。
2025-07-28 23:24:29
666
原创 VUE2 学习笔记10 组件
首先理解组件的思想在传统的前端开发中，一堆CSS、HTML、JS互相引用，会造成逻辑链条的混乱。考虑这样一种情况，对于不同的页面，需要同样的头部header和底部footer，这就导致，需要在不同的HTML页面中，会引入同样的CSS和JS，这样虽然没有很大的问题，但是会造成CSS、JS的依赖关系混乱，对于一个CSS，如果想分析这个CSS影响了多少页面，有时候是很难分析的，而且，如果修改了这个CSS，可能影响很多页面，有时候会造成很难理解的样式效果。如果JS之间存在依赖关系，依赖关系也是很难维护的。而且，对于
2025-07-28 09:11:34
754
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人