- 博客(22)
- 收藏
- 关注
RSS订阅原创 vue—组件通信
Vue组件通信方式总结 一、父子组件通信 props/emit：父组件通过props传数据给子组件，子组件通过emit触发事件回调 ref/parent：父组件通过ref访问子组件暴露的方法和属性，子组件通过$parent访问父组件（Vue3不推荐） 二、跨层级组件通信 provide/inject：祖先组件提供数据/方法，后代组件注入使用，适合多级嵌套组件通信 三、任意组件通信 事件总线：通过mitt库实现全局事件中心，支持任意组件间通信 四、状态管理 Vuex：集中式状态管理，包含state、gette
2026-07-23 14:41:09
403
原创 vue—编译器
拿到Token后，解析器会根据HTML的语法规则（以及Vue扩展的规则），将它们组织成一个树形结构（AST）。AST会清晰的描述出模板的层级关系，每个节点的类型、属性、指令等信息。Vue编译器是Vue框架的核心，它负责把我们熟悉的模板语法转化成高效的Javascript渲染函数，让浏览器能够理解和执行。例如：把v-if处理成三元表达式的逻辑结构，v-for处理成循环的逻辑结构，把@click转化成一个事件监听器的绑定逻辑。①静态提升：转化器标记出静态节点（不依赖任何响应式数据的节点），然后，它会将。
2026-07-13 17:33:59
235
原创 浏览器—输入URL全流程
本文详细描述了从输入URL到页面显示的完整流程：1）DNS解析将域名转换为IP地址；2）通过TCP三次握手建立连接（HTTPS还需TLS握手）；3）发送HTTP请求；4）服务器处理并返回响应；5）浏览器解析HTML/CSS构建DOM和CSSOM树，合成渲染树后布局绘制页面；6）通过四次挥手断开连接。文中重点介绍了DNS预解析优化、三次握手必要性、CSS/JS阻塞渲染机制及解决方案（defer/async）、HTTP/1.1的keep-alive特性等关键技术细节，完整呈现了网页加载的核心机制。
2026-07-07 11:04:45
187
原创 AI前端—第一章：软件安装
字节跳动推出的Trae软件是一款AI原生集成开发环境，国内版深度集成Doubao-1.5-pro与DeepSeek模型，支持中文自然语言生成代码框架并实时预览。海外版可通过官网下载，建议安装海外版以获得图片生成代码功能。软件提供三种工作模式：Work（文档）、Code（代码）、Design（设计），用户可自定义文件存储位置。本文为作者初步使用笔记，后续将根据实践更新。官网：国内版trae.cn，海外版trae.ai。
2026-07-03 16:00:04
418
原创 vue—生命周期
Vue组件的生命周期钩子函数允许开发者在组件不同阶段执行代码逻辑。Vue2和Vue3的生命周期基本一致，包括创建、挂载、更新、卸载四个阶段，但Vue3新增了setup函数（相当于beforeCreate+created）并调整了部分钩子名称。父子组件生命周期执行顺序遵循"父先子后"的挂载规则和"父先子后"的卸载规则。keep-alive组件会新增activated和deactivated钩子，用于管理缓存组件的激活状态。使用setup语法糖时，生命周期函数需添加on前
2026-07-02 16:19:46
78
原创 JS、浏览器——栈和队列（事件循环相关）
，引擎不等待，直接交给Web APIs（浏览器提供）去处理（处理后的回调函数会放在队列中，等待调用），自己继续执行后续代码。在这里，我们只学习栈和队列的相关内容，涉及到事件循环的知识可移步我的另一篇文章【浏览器——事件循环】“栈”负责当前做什么，“队列”负责接下来要做什么。：由宿主环境（浏览器/Node）发起的任务。结构，记录当前正在执行的函数。结构，存放等待执行的回调函数。（执行完）微任务队列中的所有任务。进入下一轮循环，再取下一个宏任务。：由 JS 引擎自身发起的任务，（Node，优先级最高）
2026-06-25 16:02:40
185
原创 浏览器——事件循环
JavaScript事件循环机制解析：通过执行栈（后进先出）和任务队列（先进先出）实现异步处理。JS单线程执行代码时，耗时操作（如定时器）由浏览器其他线程处理，完成时将回调放入任务队列。事件循环持续监控执行栈，当栈空时从队列取出回调执行。这种机制避免了阻塞，使定时器等操作看似立即执行，实则通过多线程协作实现高效异步处理。
2026-06-25 14:57:42
190
原创 CSS3——字体颜色渐变
html<p class="welcome">欢迎光临，地球欢迎你</p>CSS.welcome{ font-size: 3rem; line-height: 4rem; color: #59a5ff; /* Fallback Color */}@media screen and (-webkit-min-device-pixel-rati...
2019-03-21 10:02:54
6054
原创 vue—Router（路由跳转传参）
在vue的页面跳转中，有三种传参方法：1、路径传参 在配置路由时，我们可以配置可传参的路由（path中的id即为路径跳转中的参数），使用这种方法时，我们需要如下面的代码方式配置路由。const router = new VueRouter({ routes: [ { path: '/user/:id', component: User } ]})<...
2019-03-06 15:00:38
816
原创 vue2.0中的$router 和 $route的区别
router是全局的一个路由实例（全局变量），其中包含了所有的路由、路由的关键属性及方法用法：1、$router.push({path:'/login'}) //路由跳转，实际是往history中添加路径 2、$router.push({path:'/login',query:{name:'userName'}}) //路由传参，在route中获取参数...
2019-02-19 16:44:01
1208
原创 文本域字数限制
textarea限制输入字数(例：最大输入字数100)<input type='textarea' maxlength="100" onKeyDown='if (this.value.length>=100){this.value=this.value.substring(0,100)}' /><textarea maxlength="100" onKeyDown=...
2018-11-15 15:50:44
3140
原创 各种表单的正则验证
身份证号的正则验证（15位、18位）const IdCard=/^([1-9]\d{5}(18|19|([23]\d))\d{2}((0[1-9])|(10|11|12))(([0-2][1-9])|10|20|30|31)\d{3}[0-9Xx]$)|(^[1-9]\d{5}\d{2}((0[1-9])|(10|11|12))(([0-2][1-9])|10|20|30|31)\d{2})$...
2018-11-12 17:11:31
366
原创 vue—组件element-ui的使用
vue的一个比较常用的组件库是element-ui下面介绍一下element-ui组件的用法：首先，我们需要安装element-ui组件库，推荐使用npm安装 NPM安装命令：npm i element-ui -S CDN引入：<!-- 引入样式 --><link rel="stylesheet" href="https://unpkg.com/element...
2018-05-19 15:14:14
1141
转载 vue—登录验证
在项目开发中，我们通常会需要在进入主页时（或其他需要判断的情况），判断用户是否登录。这时，我们需要配置路由的验证方法const routes={ routes: [ { path: '/login', name:'登录', component: login },{ path: '/', name:'home', ...
2018-05-18 16:00:52
2660
原创 前端—vue环境搭建
一、官方下载vue.min.js文件，利用script标签动态引入vue，进行vue开发二、使用CDN BootCDN（国内） : https://cdn.bootcss.com/vue/2.2.2/vue.min.jsunpkg：https://unpkg.com/vue/dist/vue.js, 会保持和 npm 发布的最新的版本一致。cdnjs : https://cdnjs.c...
2018-05-08 21:41:36
261
转载 前端——ES6（1）
1、变量声明const和letes6之前，变量声明使用var关键字；无论声明在何处，都会被视为声明在函数的最顶部(不在函数内即在全局作用域的最顶部)。这就是函数变量提升es6中通常使用const和let来声明变量，let表示变量、const表示常量。let和const都是块级作用域。【块级作用域：在一个函数内部，在一个代码块内部；说白了{}大括号内的代码块即为const和let的作用域】let的作...
2018-04-11 13:45:31
501
原创 浏览器——内核知识
本文介绍了四种主流浏览器内核及其特点：Trident（IE内核）由微软开发，应用于Windows系统但不开源；Gecko是开源的跨平台内核，主要被Firefox使用；WebKit以渲染速度快著称，用于Safari和Chrome；Presto是Opera自主研发的高速引擎。文章还列举了各内核的代表浏览器及其应用场景，简要说明了不同内核的技术优势和适用平台。（148字）
2018-04-10 16:50:17
664
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人