- 博客(810)
- 资源 (2)
- 收藏
- 关注
RSS订阅原创 6. pager组件
那么这个根结点呢，我们一般来说就是个div，那么这个div的内样式呢，其实它有一个细节啊，就是它的内样式命名，一般来说我们命名为组件的名称如“ Page，加上一个短横线命名法。我们之前学习DOM元素，使用各种各样的事件，但是我们从来没有抛出过事件，我们使用过事件参数，但是我们没有在抛出事件的时候指定事件参数，抛出的事件中第一个参数就是事件名，第二个就是事件数据，即事件参数【第二个是树越稳定，渲染效率越高。我的页面变化了，我处理不了，你去处理，让上边去处理，抛出个事件能理解这意思吧，抛出事件的时候呢，其实。
2025-09-15 03:15:10
669
原创 5.计算属性
时科”变“狗婶”发生在模板渲染阶段（render 阶段），因为你在模板中写了一个副作用表达式 {{ setNewName(“狗婶”) }}，这个表达式在渲染时就执行了，修改了 name，所以你根本看不到“时科”显示在页面上。
2025-09-13 15:47:01
931
原创 4.搭建工程及v-bind补充
prop是Vue组件之间通信的基本方式，用于父组件向子组件传递数据。子组件需要显式声明接收的prop，形成一个接口契约。
2025-09-11 15:21:37
922
原创 3. 组件
如果说我们啥都不管，全部的东西往模板里边写。然后所有的数据配置，方法配置啊，全部写到一块。整个程序的复杂度了，直接突破天际了，尽管呢，Vue已经减轻了很多复杂度了，我们不用去操作真实DOM。但是呢。还是很复杂。这第一个问题，复杂度的问题，第二个问题呢，就是重用的问题，因为在一个项目里边总归是有一些东西是要重复的，有些地方会重复啊，网站中总归是有一些重复的东西，如果说你不考虑的话，全部写到一块儿的话。你重复的东西怎么提取呢，两个问题。
2025-09-10 13:08:39
579
原创 2. Vue核心概念
cons vm= new Vue( { } ) 首先创建了一个Vue的实例。那么，这个实例里边会有一些属性，有些方法，我们当时还演示过这个实例，里边是不是有这个 title，有这个 products，那是怎么回事呢，咱们来看一下第一个概念叫做，叫做注入。大家看这个图，我们当时是不是创建了一个 new Vue( { })，是不是创建了一个 Vue 的实例，那么这就是生成了一个 Vue 的实例对象。这个对象里边儿，它本身自带了一些成员，就是Vue这个框架给我们加的一些成员，那么我们来看一下这些成员啊，我们把把
2025-09-09 23:21:36
652
1
原创 1. 前端的框架由来
后来后端开发者群体会抱怨，而且随着我们的网站越来越复杂，后端的功能越来越多前端的功能就页面上的功能，交互性越来越强，后端开发者做的事情是不是越来越多，他不断要完成各种业务功能所以说后端开发者已经，承受不了这么大的开发压力了于是就开始想办法，那我前端开发者太闲了后端开发者压力太大了，能不能让前端开发者去组装页面呢，那么这就涉及到前后端分离了，怎么把前端的工作，就组装页面按理说应该是前端的工作，以前没办法是在服务器组装的，那我们能不能换一种思路呢，于是出现了下面这种做法叫做前后端分离，
2025-09-07 18:03:13
519
原创 标签疑难杂病
点击这个链接时，浏览器会在新标签页中打开 https://www.example.com ，而不会关闭或跳转当前页面。target=“_blank” 表示：在新标签页中打开链接。
2025-09-07 14:02:06
169
原创 工程化综合练习【豆瓣】
效果展示地址：https://study.duyiedu.com/movie接口地址：https://app.apifox.com/link/project/2429576/apis/api-67925177。
2025-09-07 14:00:59
991
原创 使用nvm切换node版本
所以你这边的话就是有必要修改一下这个 npm源, 但是我刚才看了一下，就我们刚才在改 这个nvm源的时候, 我们这边已经把这个npm的 这个mirror是不是已经改好了，就是这个npm源。那如果你这边node.js版本和老师的这个node.js版本不一致的话，经常会遇到一些错误啊, 那我们这边的话就可以通过这个nvm这个工具，你可以隨时可以安装多个版本的node.js, 这样老师上课的时候他用哪个node.js版本，那你直接就是切换成那个对应的版本就可以了。
2025-08-31 05:40:40
289
原创 CSS工程：Less工程化
Less是一种更加简洁的样式代码，它非常像CSS，但又不太一样，它让编写样式变得更容易下面是css代码和Less代码的对比，它们都表达了一样的含义Less代码虽好，但它无法被浏览器识别，因此需要一个工具将其转换为血统纯正的css代码由于node环境具有读写文件的能力，于是在node环境中可以轻松的完成文件的转换npm上有一个包叫做less，它运行在node环境中，通过它可以完成对Less代码的转换npm上有一个包叫做less他有个能力，它是利用这个node环境的读写文件的能力, 它把可以把less。
2025-08-31 04:00:53
600
原创 依赖包管理器，【npm命令行工具】
npm官网：https://www.npmjs.com/npm全命令：https://docs.npmjs.com/cli/v7/commands包管理器它是这样子的，就是咱们前端不是有很多第三方库嘛，那些第三方库呢，每个都有自己的官方网站哎，你进去过后呢，你就去下载它的一个 JS 压缩包，下载下来过后呢，解压。然后再拷贝你的工程里边儿，然后呢，在这页面上用一个元素 < script > 元素去引用它,这是我们以前使用第三方库的东西呃。它的具体做法，是不是很麻烦啊？对不对？
2025-08-29 01:47:06
724
原创 综合练习：ES Module标准实现模块化
查阅文档，按照老师的模块划分思路完成「综合练习效果」登录接口文档：https://app.apifox.com/link/project/2429576/apis/api-67925168测试账号：username测试密码：123123。
2025-08-28 14:52:06
131
原创 ES Module标准实现模块化【官方标准】
静态依赖是要在运行代码之前就要分析出依赖关系，代码 还没有运行, 我就要知道这个模块，依赖哪些模块？我是要在代码的运行过程中比方说一个判断，一个循环,一个函数。依赖是用来导入的，有了这句话就应该懂了什么是依赖了【还没使用的export都叫依赖】，再书写一个 ESM 模块，查阅文档，导入上面的模块，你可以写出多少中导入的方式。一个模块可以同时存在两种导出方式，最终会合并为一个「对象」导出。书写一个 ESM 模块，查阅文档，导出下面的模块对象。书写一个 ESM 模块，查阅文档，导出下面的模块对象。
2025-08-28 14:49:18
1036
原创 JavaScript中常用函数【要经常看】
返回一个新字符串，表示原字符串中从 indexStart 到 indexEnd（不包含）之间的字符。substring() 是 JavaScript 中用于从字符串中提取子字符串的一个非常常用的方法。【提取指定范围内的字符串，且提取后的字符串仍然保留着原先的格式】🔍 一、substring() 方法详解。
2025-08-26 05:07:05
244
原创 CommonJS标准实现模块化
math.JS 文件这个文文件呢，它是提供一些数学相关的函数啊，我们要编写的就是模拟我们在真实项目里边儿，把很多事情呢拆分成不同的文件去处理。进入终端，然后呢，我们去运行一下这个 Node 命令，后边跟上我们的文件名 JS文件名就是 index . js。因此呢，可以看到，我们 node 环境里边是不需要浏览器参与的，是直接运行。模块中的所有全局定义的，变量、函数，都不会污染到其他模块，【如该JS文件中定义var a=1,只能运行在该文件中，其他文件无法调用该文件定义的变量】我们也可以运行，它怎么运行呢？
2025-08-26 05:05:13
829
原创 第三方库【jQuery,Lodash，Animate.css，Axios，MockJS，Moment，Echarts】
在 Mock.js 中，@ 是一个非常重要的符号，用于表示占位符（Placeholder） ，它的作用是：告诉 Mock.js：这里需要根据某种规则自动生成数据，而不是直接使用你写的值。axios是一个请求库，在浏览器环境中，它封装了XHR，提供更加便捷的API发送请求，是一个使用同一个API既可以在游览器环境下使用，又可以在Node环境下使用，还提供了很多方法，如text( )方法，appendTo( )方法等等，这些方法都可以帮你批量的操作DOM元素，如添加一个类样式，所有DOM都添加了，
2025-08-24 00:24:19
936
原创 Axios 第三方库应用
你已经掌握了一个完整的 前端请求封装方案，包括：axios 实例化、拦截器统一处理、API 函数封装、token 自动管理、错误统一提示，这已经是一个可以用于实际项目的请求封装方案了！baseURL 表示所有请求的前缀，比如 /api/user/login 实际请求地址是：https://study.duyiedu.com/api/user/login。如果你希望我帮你把这段代码整理成一个完整的项目结构，或者加上登录状态管理、退出登录等功能，也可以告诉我，我可以继续帮你扩展。🔐 四、API 封装函数。
2025-08-22 14:42:17
365
原创 Lodash第三方库的应用
Lodash 的主要作用是提供一套实用、安全、高效的函数，帮助开发者更轻松地处理 JavaScript 中常见的数据操作任务，尤其是在处理数组、对象、函数式编程等场景中，极大地提升了开发效率和代码可读性。
2025-08-16 21:29:42
194
原创 git 常用命令
方便我们切换版本啊，方便我们管理版本。管理不同版本回退到任意时刻，这个是我们真正要用它的一个目的啊，那这只是其一啊，管理版本回退到任意时刻，那还有其二，就是我们的一个协同开发。对吧哎，这有一个表格，这个表格呢，其实就是这个。把我们想放入版本库的文件，在工作区将我们要改的文件改好，然后先放到暂存区打包起来，最后放到版本库中，形成一个版本，而版本库中的版本切换是靠制作进行的。我们文件的变更啊，我们需要先把这个当前文件夹，初始化成一个仓库，这个仓库就有版本控制啊，多人协作这样的一个功能能，所以先要初始化仓库，
2025-08-13 22:14:12
763
原创 网络学习和服务请求
对于前端而言，网络部分代码不多，以概念为主。对概念的理解程度，决定了是否能够看懂接口文档，同时也决定了是否能更好的掌控网络相关代码。
2025-08-09 15:27:39
563
原创 JavaScript——6.全局对象
以后在公司里开发，我们可能一人负责一个JS,在一个JS里面我们把所有代码封装到一个立即函数中，把我们需要暴露的东西使用返回即可，如果想暴露多个东西，可以采用返回对象。所有的全局变量、全局函数都会附加到全局对象，这称之为全局污染，又称之为全局暴露，或简称污染、暴露。给未声明的变量赋值，实际就是给全局对象的属性赋值【即window的属性】 ，永远别这么干。// 使用 1.js 暴露的函数和变量。var a = 1;var b = 2;var b = 4;// 暴露为：sayHi。// 暴露为：count。
2025-07-14 16:14:42
298
原创 JavaScript——3. 函数流程切割
设计函数就是如何切割流程，具体来说就是设计出函数的三要素，这一步是最难的，目前无须同学们掌握，老师会帮你把函数设计好。如果在函数的帮助下，反而觉得流程变得复杂了，极有可能的原因是开发思想没有做相应的切割，导致思想负担过重。使用函数切割流程，不仅可以减少重复代码、还可以有效的降低整体复杂度。只要具备三要素，就能书写函数体；根据设计的三要素完成函数体，这一步就是现阶段练习的重点。注意：return 是结束函数，break是结束循环。函数的核心作用，是为了让某一段复杂的流程变得简单。函数体：表示具体的流程。
2025-07-12 15:48:51
442
原创 JavaScript——1. 数据的表达式
在 JavaScript 中，对象的键（属性名）如果是合法标识符（identifier） ，则在 console.log 输出时不会被加上引号。书写代码时我们无须关注这些规则，直接按照简写方式书写属性，若编辑器出现报错，则使用引号包裹属性名即可。一个完整的程序中，会涉及成百上千的标识符，好的名称不仅可以减少名称冲突，更有利于程序的阅读和维护。程序中任何需要数据的地方，都可以使用上面任意一种数据表达。，和其他命令式编程语言一样，它的本质是。，把要读取的属性名传递到中括号中，为了书写的方便，当对象的属性名是。
2025-07-10 13:49:01
781
原创 JavaScript——闭包特性与作用
闭包(Closure)是JavaScript中一个强大而独特的特性，指的是函数及其捆绑的周边环境状态的引用的组合。简单来说，闭包就是一个函数能够访问并操作其定义时所在的词法作用域，即使该函数在其定义的作用域之外执行。核心概念词法作用域：函数在定义时确定的作用域，而非执行时作用域链：函数可以访问其自身作用域、外层函数作用域和全局作用域中的变量状态保存：闭包能够"记住"其定义时的环境，即使外部函数已经执行完毕生活比喻。
2025-07-08 17:13:51
888
原创 JavaScript——Reflect
Reflect是ES6引入的一个内置对象，它提供了一组静态方法，用于执行那些通常是JavaScript语言内部的对象操作。Reflect的方法与Proxy handlers的方法一一对应，允许开发者以函数式的方式操作对象。核心特点是一个内置对象，不是构造函数，不能使用new操作符所有方法都是静态方法，类似于Math对象方法与Proxy handlers的方法一一对应提供了更合理的返回值和错误处理方式以函数式方式操作对象，替代了部分Object方法和操作符方法作用。
2025-07-08 16:50:03
1105
原创 JavaScript——集合： Map与WeakMap
Map是ES6引入的一种新的集合类型，用于存储键值对(key-value)集合。与传统对象(Object)类似，但具有更强大的功能和灵活性。Map vs Object的主要区别特性MapObject键类型可以是任意类型（字符串、数字、对象、函数等）主要是字符串或Symbol键顺序保留插入顺序ES6之前不保证顺序，ES6之后为插入顺序大小获取直接通过size属性需要手动计算（Object.keys(obj).length）迭代方式可直接迭代。
2025-07-08 16:19:29
1064
原创 Vue3 ——Teleport传送API
Teleport（传送门）是Vue3提供的一个内置组件，用于将组件的模板内容渲染到DOM中的指定位置，而不受组件在组件树中的层级限制。核心特点渲染位置与逻辑分离：组件的逻辑仍属于当前组件，但内容渲染到指定DOM节点突破样式限制：避免父组件的z-index等样式限制保持组件关系：虽然内容被传送，但仍能访问父组件的props和方法，参与组件通信简化CSS：无需使用复杂的CSS定位来突破父组件限制解决的问题被父组件的裁剪难以设置正确的z-index层级复杂的定位样式。
2025-07-05 16:17:35
1270
原创 Vue3——响应式数据判断
Vue3的响应式系统是其核心特性之一，基于ES6的ProxyAPI实现，相比Vue2的具有更强大的功能和更好的性能。核心特点代理而非劫持：通过Proxy代理整个对象，而非劫持单个属性深层响应式：默认递归转换对象的所有嵌套属性多种响应式类型：支持普通响应式、只读响应式、浅层响应式等显式判断API：提供了一系列函数用于判断数据的响应式类型主要响应式APIref()：创建基本类型的响应式数据reactive()：创建对象类型的响应式数据readonly()：创建只读的响应式数据。
2025-07-05 15:54:46
889
原创 Vue3——provide与inject组件通信
provide和inject是Vue3提供的一种跨层级组件通信方式，用于祖先组件向其所有子孙组件注入依赖，而无需通过props在每一层级手动传递。核心特点跨层级通信：可以跳过中间组件，直接在祖先和后代组件间通信简化深层传递：解决了props需要逐层传递的"props drilling"问题灵活注入：后代组件可以选择性注入需要的数据或方法非响应式默认：默认情况下传递的数据是非响应式的，需特殊处理实现响应式使用场景深层级组件间的数据共享（如主题、语言、用户信息等）组件库开发中的上下文传递。
2025-07-05 15:24:58
1401
原创 Vue2——父组件给子组件传值
props是Vue组件通信中最基础的方式之一，用于父组件向子组件传递数据。props是子组件上的自定义属性，父组件可以通过这些属性向子组件传递数据。核心特点单向数据流：数据只能从父组件流向子组件，子组件不能直接修改props可预测性：明确声明需要接收的数据，使组件接口清晰验证机制：可以指定数据类型、默认值和验证规则灵活性：支持多种数据类型，包括基本类型、对象、数组和函数使用流程父组件在引用子组件时，通过属性传递数据子组件在props选项中声明接收的数据。
2025-07-05 13:44:41
1024
原创 JavaScript——闭包特性与作用
闭包(Closure)是JavaScript中一个强大而独特的特性，指的是函数及其捆绑的周边环境状态的引用的组合。简单来说，闭包就是一个函数能够访问并操作其定义时所在的词法作用域，即使该函数在其定义的作用域之外执行。核心概念词法作用域：函数在定义时确定的作用域，而非执行时作用域链：函数可以访问其自身作用域、外层函数作用域和全局作用域中的变量状态保存：闭包能够"记住"其定义时的环境，即使外部函数已经执行完毕生活比喻。
2025-07-05 11:38:40
952
原创 VUE3 ——customRef特性与作用
customRef是Vue3提供的一个高级响应式API，用于创建自定义行为的ref对象。它允许开发者自定义ref的 getter 和 setter 逻辑，从而实现特殊的响应式需求。核心特性自定义响应式行为：可以控制数据读取和修改的逻辑完全控制依赖追踪：手动决定何时触发依赖收集和更新通知灵活性高：可实现防抖、节流、延迟更新等高级功能与普通ref兼容：创建的对象可以像普通ref一样使用工作原理customRef接收一个工厂函数作为参数，该函数返回一个包含get和setget()
2025-07-05 11:00:49
1076
原创 Vue2源码解析——6. Vue响应式系统变化侦测机制大总结
变化侦测是Vue响应式系统的基础，其核心目标是自动侦测数据变化并发出通知，实现数据与视图的自动同步。Vue2通过实现对数据的监听，当数据被读取时收集依赖，当数据被修改时通知依赖更新。Vue2响应式系统基于Observer：将数据对象转为响应式，递归处理所有子属性Dep：管理依赖关系，作为数据与Watcher的中介Watcher：订阅数据变化，执行更新操作数据初始化时，Observer将其转为响应式Watcher读取数据时，触发getter完成依赖收集。
2025-07-05 10:27:05
85
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人