- 博客(157)
- 收藏
- 关注

原创 【Vue】本地数据存储 & TodoList watch监视本地存储(超快速)
是 Vue 提供的一种“深度监听”的机制,能追踪数组和对象内部任意层级的变化。该方法接受一个键和值作为参数,会把键值对添加到存储中,如果键名存在,则更新其对应的值。如果xxx对应的value获取不到,那么getItem的返回值是null。SessionStorage存储的内容会随着浏览器窗口关闭而消失。LocalStorage存储的内容,需要手动清除才会消失。 该方法接受一个键名作为参数,并把该键名从存储中删除。 该方法接受一个键名作为参数,返回键名对应的值。 该方法会清空存储中的所有数据。
2025-04-30 07:00:00
1337

原创 【Git】远程仓库的创建&&仓库的拉取及推送
进入Git平台后,我们可以看到 文件,介绍该仓库的作用,包括里面的分支内容,和我们前面学习的 是一样的。右边也有所有的成员管理:新建 ,例如在开源后,外面的人发现了我们的程序有bug,能够与仓库管理者进行沟通的地方。如果完成该项修改后,就可以把待办的修改成已完成。进来后,就能看到readme文件,来介绍该仓库的作用包括里面的分支内容,也是跟我们前面学习的git branch是一样的右边也有所有的成员管理:新建lssues, 是比如开源后 外面的人发现了我们的程序有点bug,能够与仓库管理者进行沟通
2025-04-28 08:00:00
1192

原创 【CSS】精通Flex布局(全)
1. 搭建HTML结构flex是flexible Box的缩写, 意为“弹性布局”, 用来为盒状模型提供最大的灵活性, 任何一个容器都可以指定为flex布局。采用Flex布局的元素, 称为Flex容器(flex container), 简称“容器”。它的所有子元素自动成为容器成员, 称为Flex项目(flex item), 简称“项目”。总结flex布局原理:就是通过给父盒子添加flex属性, 来控制子盒子的位置和排列方式1. 主轴与侧轴再flex布局中, 是分为主轴 和 侧轴两个方向, 同样的叫法有
2025-04-27 08:00:00
1973

原创 【算法专题二十七】前缀和&差分思想
最关键的就是,要记录每个区间重复的次数,这里就要开辟新的数组来记录重复出现的次数,在重复得到m次区间sum的条件下,又要在 r - l 的次数内记录当前下标出现的次数在index数组内,也就是O(m * n) 的时间复杂度,这里就会发现,过不了最后一个测试用例!由此就可以看出,前缀和数组,是在以空间换取时间的前提下,O(n)下遍历数组,得到一个空间复杂度也为O(n) 的nums数组,在O(1) 的条件下,直接得到关于[l,r]区间内的arr数组的和。那么他的原理是什么呢?
2025-03-02 15:22:17
1215

原创 彻底学懂BFS广度优先遍历(最全解)
广度优先遍历(Breadth-First Search,BFS)是一种图形搜索算法,从图的某一特定顶点出发,首先访问其所有邻接顶点,然后再依次访问这些邻接顶点的邻接顶点,如此一层一层地向外扩展,直到访问完所有顶点。在二叉树等数据结构中,BFS 通常按照从根节点开始,一层一层地横向遍历节点。
2024-09-04 07:00:00
7000
2

原创 一个题目教会你使用 priority_queue<int,vector<int>> q 优先级队列 和 unordered_map<int,vector<int>> hash 二维数组 hash表
对于unordered_map hash;有了更深层的理解,对于二维数组的引用不管是push_back() , 还是hash[ ].erase(hash[ ].begin())删除都有了更深的影响。对于优先级队列priority_queue 底层是大小堆的实现有更深的了解 , 非常建议自己动手来实现一下大小堆!!
2024-08-26 07:45:00
2616
原创 【AJAX项目】黑马头条——数据管理平台
本文介绍了基于BootStrap和wangEditor开发的前端项目技术要点。主要内容包括:1)验证码登录实现,通过axios与后端交互并处理权限验证;2)Token管理机制,包括存储、验证和拦截器配置;3)富文本编辑器集成和文章发布功能;4)内容管理系统实现,包含文章列表展示、筛选、分页和删除功能;5)文章编辑功能,支持数据回显和更新保存。项目采用模块化开发,使用axios拦截器统一处理请求/响应,实现了完整的权限控制和数据交互流程。技术栈包括BootStrap、wangEditor、axios等,适合内
2025-07-27 04:32:30
788
1
原创 【AJAX】Promise详解
本文介绍了JavaScript异步编程的核心概念和解决方法。主要内容包括:同步与异步的区别、回调函数地狱问题及其缺点、Promise链式调用的解决方案、async/await语法简化异步代码、try-catch错误处理机制。此外还讲解了事件循环模型、宏任务与微任务的执行顺序、Promise.all静态方法合并多个异步请求,并通过分类导航案例展示了实际应用。这些方法有效解决了回调嵌套问题,提高了代码可读性和执行效率。文章还提供了相关学习资源链接,适合前端开发者深入理解异步编程。
2025-07-25 21:28:21
859
1
原创 【AJAX】XMLHttpRequest、Promise 与 axios的关系
本文介绍了AJAX技术的核心XMLHttpRequest对象的使用方法。主要内容包括:1. XMLHttpRequest基础使用,包括创建对象、配置请求、监听事件和发送请求;2. 查询参数处理,使用URLSearchParams转换参数;3. 数据提交方法,设置请求头和请求体;4. Promise异步编程,解决回调地狱问题;5. 封装简易axios函数,支持GET/POST请求、查询参数和请求体数据;6. 天气预报案例实战,展示数据获取和渲染过程。文章通过具体代码示例,详细讲解了前端异步请求的实现原理和应用
2025-07-24 16:25:31
1269
1
原创 【AJAX】图书管理系统
本文主要介绍了使用Bootstrap和Axios实现图书管理系统核心功能的技术要点: Bootstrap弹窗实现 通过data属性控制弹窗显示/隐藏 也可通过JS对象方法控制,适合需要前置逻辑的场景 图书管理系统核心功能 图书列表渲染:使用axios.get()配合params参数查询 新增图书:axios.post()提交表单数据 删除图书:axios.delete()通过URL传ID 编辑图书:axios.put()更新全部字段 关键知识点 GET与POST请求区别:查询参数vs请求体 FormData
2025-07-21 09:08:46
946
原创 【Vue3】其他Composition API
重点讲解了shallowReactive和shallowRef的区别,前者仅响应对象第一层属性,后者仅处理基本数据类型响应。文章还介绍了readonly/shallowReadonly创建只读数据,toRaw/markRaw处理原生对象的方法,以及customRef实现自定义响应逻辑。此外,还说明了provide/inject的跨组件通信机制,Teleport组件的位置转移功能,Suspense处理异步组件,以及Vue2到Vue3的API变化。
2025-05-29 17:34:00
810
原创 【Vue3】生命周期 & hook函数 & toRef
本文介绍了Vue3中生命周期钩子和组合式API的使用方法。首先回顾了Vue2的生命周期钩子,分析了Vue3中setup函数与生命周期执行顺序的关系。重点讲解了组合式API的用法,包括如何用onXxx形式替代传统生命周期钩子,并比较了两种写法的优先级。文章还详细展示了自定义hook函数的开发过程,通过抽离鼠标坐标追踪功能,演示了代码复用的实现方式。最后深入解析了toRef和toRefs的区别和使用场景,强调toRef保持数据响应式的特性。全文提供了完整的代码示例,帮助开发者理解Vue3的核心特性转换。
2025-05-27 20:06:13
1288
2
原创 【Vue3】setup执行机制 和 computed函数、watch函数注意点(超重要!)
在Vue2中,父组件向子组件传值可以通过props或$attrs实现,而Vue3中则通过setup函数处理props、context等参数。Vue3的setup函数在beforeCreate之前执行,且this为undefined。计算属性在Vue3中通过computed函数实现,支持简写和完整写法。监视函数watch在Vue3中可以监视单个或多个响应式数据,支持立即执行和深度监视,而watchEffect则自动监视回调函数中用到的属性。
2025-05-22 17:12:58
839
原创 【Vue3】数据的返回和响应式处理(ref & reactive)
t=P1C7t=P1C7t=P1C7yihaohhh/我爱Vue - Gitee.comhttps://gitee.com/liu-yihao-hhh/i-love---vue/tree/master/03_src3_ref%E5%87%BD%E6%95%B0你可以把Reflect理解为一个官方提供的工具库,专门用于安全、标准地操作对象。// 普通写法// 更安全写法是“官方提供的设置方法”,多了一层保护,比如你设置失败它会给你 false,不会直接报错。
2025-05-21 21:38:55
1831
原创 【Vue3】Vue3工程的创建 及 开发者工具的安装
t=P1C7yihaohhh/我爱Vue - Gitee.comhttps://gitee.com/liu-yihao-hhh/i-love---vue/tree/master/01_src3_%E5%88%86%E6%9E%90%E5%B7%A5%E7%A8%8B%E7%BB%93%E6%9E%84。
2025-05-21 18:10:00
900
原创 【Vue】element组件库
Element,一套为开发者、设计师和产品经理准备的基于 Vue 2.0 的桌面端组件库本节素材已上传至Gitee:yihaohhh/我爱Vue - Gitee.com。
2025-05-20 06:00:00
839
原创 【Vue】路由2——编程式路由导航、 两个新的生命周期钩子 以及 路由守卫、路由器的两种工作模式
t=P1C7t=P1C7t=P1C7t=P1C7t=P1C7t=P1C7yihaohhh/我爱Vue - Gitee.comhttps://gitee.com/liu-yihao-hhh/i-love---vue/tree/master/37_src_%E7%BC%96%E7%A8%8B%E5%BC%8F%E8%B7%AF%E7%94%B1%E5%AF%BC%E8%88%AA。
2025-05-19 20:38:29
1173
原创 【JavaScript】用 Proxy 拦截对象属性
你可以把Reflect理解为一个官方提供的工具库,专门用于安全、标准地操作对象。// 普通写法// 更安全写法是“官方提供的设置方法”,多了一层保护,比如你设置失败它会给你 false,不会直接报错。},})只需要将所有的target[key] = value 修改成Reflect.set(target, key, value)即可,函数会自动帮我们生成对应的方法的t=P1C7t=P1C7。
2025-05-19 17:41:07
1232
原创 【Vue】路由1——路由的引入 以及 路由的传参
路由是前端开发中实现页面切换和内容展示的重要机制。在单页面应用中,通过配置不同的路径与组件的对应关系,用户点击导航栏时无需刷新页面即可完成内容切换。Vue 中使用 Vue Router 插件进行路由管理,开发者通过 `router-link` 实现导航,通过 `router-view` 指定组件的展示区域。路由支持多级嵌套,同时可以通过 query 或 params 传递参数,并在组件内通过 `$route` 获取。为了提高组件复用性和代码清晰度,还可以配置 props 方式将参数直接映射为组件的属性。
2025-05-18 21:08:12
920
1
原创 【vue】vuex实现组件间数据共享 & vuex模块化编码 & 网络请求
本文介绍了如何在Vue.js项目中使用Vuex进行组件间数据共享,并通过模块化和命名空间的方式优化代码结构。首先,通过创建Count和Person组件,展示了如何在Vuex中定义state、mutations、actions和getters来实现数据共享。接着,针对大型项目中Vuex模块可能变得臃肿的问题,提出了将不同功能模块化的解决方案,即将每个功能的actions、mutations、state、getters封装成独立对象,并在Vuex.store中进行模块化暴露。
2025-05-10 23:57:54
1133
原创 【Vue】vuex的getters & mapState & mapGetters & mapMutations & mapActions的使用
本文介绍了Vuex中的四个辅助函数:mapState、mapGetters、mapMutations和mapActions,用于简化Vuex的使用。首先,通过getters可以对state中的数据进行加工,类似于计算属性。接着,mapState和mapGetters帮助将state和getters中的数据映射为组件的计算属性,减少了重复代码。mapMutations和mapActions则用于生成与mutations和actions交互的方法,简化了commit和dispatch的调用。
2025-05-10 19:18:42
1666
2
原创 【Vue】vuex环境搭建 & 基本使用
store.dispatch('action中的方法名',数据)或$store.commit('mutations中的方法名',数据)备注:若没有网络请求或其他业务逻辑,组件中也可以越过actions,即不写dispatch,直接编写commit。
2025-05-09 07:30:00
1440
原创 【Vue】插槽
父组件 ===> 子组件html结构1</div>子组件中:<template><div>-- 定义插槽 --><slot>插槽默认内容...</slot>
2025-05-09 07:00:00
763
原创 【Vue】axios实现github案例《大批量搜索github用户》
在asserts 里面配置就是要用import进行引入,那么就会进行严格的检查bootstrap.css 用到了不存在的资源 所以还是不要在asserts 静态资源里面引入。那么我们只需要得到response.data.items的数组内容传给List组件即可,那么这就是兄弟组件之间的互相通信 1. 全局事件总线 2. 消息的订阅与发布。还可以进一步优化一下,观察上面,在我们进行搜索的时候,会有一段空白期,我们不知道是否使网页卡住还是正在请求中,所以我们要在每一个阶段都让页面有消息能够显示在页面上。
2025-05-08 08:00:00
766
原创 【Vue】配置代理
说明:优点:配置简单,请求资源时直接发给前端(8080)即可。缺点:不能配置多个代理,不能灵活的控制请求是否走代理。工作方式:若按照上述配置代理,当请求了前端不存在的资源时,那么该请求会转发给服务器 (优先匹配前端资源)
2025-05-08 07:00:00
1274
原创 【Vue】Vue封装的过度与动画
作用:在插入、更新或移除 DOM元素时,在合适的时候给元素添加样式类名。图示:写法:准备好样式:元素进入的样式:v-enter:进入的起点v-enter-active:进入过程中v-enter-to:进入的终点元素离开的样式:v-leave:离开的起点v-leave-active:离开过程中v-leave-to:离开的终点使用<h1 v-show="isShow">你好啊!</h1>,且每个元素都要指定key值。
2025-05-07 07:00:00
926
原创 【Vue】消息订阅与发布_pubsub & TodoList 编辑事件
任意组件间通信</span>。使用步骤:引入:接收数据:A组件想接收数据,则在A组件中订阅消息,订阅的<span style="color:red">回调留在A组件自身。
2025-05-07 06:45:00
1053
原创 【Vue】全局事件总线 & TodoList 事件总线
全局事件总线图:到main.js 里面设置全局总线由于上面只是一个普通对象, 所以我们没有办法能够访问它的$on, $off以及$emit, 因为这些只存在组件的实例对象中, 那么我们第一件事情就是要创建组件的实例对象。Student组件用来传值:School用两个生命周期钩子进行获取值:分别用来绑定事件 和 解绑解绑事件!虽然我们学习了全局事件总线,任意两个组件之间的通信都非常方便,但是也不是所有组件之间的通信都要用上全局事件总线,就比如:父
2025-05-06 17:17:10
1026
原创 【Vue】组件自定义事件 & TodoList 自定义事件数据传输
想要把Student子组件的name传给父组件 可以用函数来接受Student的name值, 然后更新App组件的studentName的值这是可行的!<h1>{{ msg }}, 学生姓名是:{{ studentName }}</h1>// params 是一个数组console.log('App被调用!},console.log('App被调用!}) // 绑定自定义事件用ref也是可行的!
2025-05-06 09:14:22
1255
原创 【Vue】深入组件&分析脚手架
简单来说,ref是 Vue 提供的一个 API,用来给元素或者子组件绑定一个引用标识,方便我们在代码里直接拿到这个元素或者组件实例。在 Vue2 中,使用$refs获取;在 Vue3 的 Composition API 中,使用ref或获取。refs 获得组件实例对象👉ref就是让你可以在Vue中,直接拿到DOM元素或组件实例的一个快捷通道。props是父组件传递数据到子组件的一种机制。简单理解就是:父亲给儿子发东西,儿子通过props接收。在 Vue 中,子组件通过props。
2025-04-29 08:00:00
969
原创 【Git】多人协作开发
现在就是又遇到了合并feature-1的问题,为了避免冲突 我们就还是再feature-1分支上来合并master。可以看到每次开发都是自己创建的分支,然后进行 push,每次都能成功,不会遇到冲突的问题。上创建的分支,然后自己创建的分支只有自己开发的时候能够用上,所以不会出现 push 冲突的问题。此时,我们又回到了多人开发一中的情形,开发者1和开发者2在同一个分支开发。文件进行修改,可是 push 的时候却发生错误,提示当前的本地与远程仓库有区别!,然后开发者1和开发者2都同时在这个分支上进行操作。
2025-04-28 09:00:00
1344
原创 【Git】初始Git及入门命令行
t=P1C7Git 官网https://git-scm.com/
2025-04-27 18:08:13
1059
原创 【Vue】组件基础
在学习 Vue 的过程中,我们经常会接触到两种不同的写法:一种是在 HTML 中用 标签直接使用 Vue,另一种则是用 文件编写的单文件组件。那么它们有什么区别?我们又该在什么场景下选择哪种方式呢?Vue中使用组件的三大步骤: 一、定义组件(创建组件) 二、注册组件 三、使用组件(写组件标签) 1、如何定义一个组件? 使用Vue.extend(options)创建,其中options和new
2025-04-21 23:13:09
790
原创 【Vue】生命周期详解:从创建到销毁,全面掌握组件的生命轨迹
在 Vue 中,生命周期是指一个组件从被创建、渲染、更新到最终被销毁的整个过程。通俗一点说,每个 Vue 组件都像是一个“有生命的个体”,会经历出生(创建)、成长(挂载)、变化(更新)和死亡(销毁)等阶段。Vue 提供了一系列的“生命周期钩子函数”,让我们在合适的时机执行特定的操作,比如数据初始化、DOM 操作、定时器清理等等。又名:生命周期回调函数、生命周期函数、生命周期钩子。是什么:Vue在关键时刻帮我们调用的一些特殊名称的函数。
2025-04-08 16:48:53
1567
原创 【Vue】入门进阶必看:表单收集、过滤器、内置指令、自定义指令全解析
Vue 除了提供大量内置指令,还允许开发者注册自定义指令以满足个性化需求。需求1:定义一个v-big指令,和v-text功能类似,但会把绑定的数值放大10倍。需求2:定义一个v-fbind指令,和v-bind功能类似,但可以让其所绑定的input元素默认获取焦点。
2025-04-07 18:45:40
1049
原创 【Vue】 核心特性实战解析:computed、watch、条件渲染与列表渲染
特性v-ifv-show控制方式动态添加/移除 DOM控制首次渲染性能较慢较快切换频率建议用于不频繁切换频繁切换更适合。
2025-04-05 17:12:14
1104
原创 【Vue2】数据绑定_MVVM模型_数据代理_事件处理
目录一、 数据绑定1. Vue中有2种数据绑定的方式:2. 响应式原理el 与 data 的两种写法二、 MVVM模型三、 数据代理1.回顾Object defineproperty方法2. 何为数据代理3.Vue中的数据代理四、 事件处理1.事件的基本使用:2. Vue中的事件修饰符:3. 键盘事件总结不易~ 本章节对我有很大的收获,希望对你也是!!!Vue2 的数据绑定是其核心特性之一,它采用 双向数据绑定(Two-way Data Binding) 机制,使数据和视图保持同步更新。 备注:单向绑定()
2025-04-02 16:19:52
1264
原创 【Vue2】初始Vue & 开发环境的搭建
目录1. Vue 简介1.1. 官网编辑1.2. 介绍与描述1. Vue.js 是什么?2. Vue 的特点1.3. Vue 的特点1️⃣ 轻量级 & 易上手1.4. 与其它 JS 框架的关联1️⃣ Vue 与 React 的对比📌 结论2️⃣ Vue 与 Angular 的对比📌 结论3️⃣ Vue 与 jQuery 的对比📌 结论4️⃣ 什么时候选择 Vue?2. 初识 Vue1️⃣ Vue 的基本概念Vue 的特点2️⃣ Vue 开发环境搭建(1)引入 Vue📌 但是这里还是提供一种原始的V
2025-04-02 00:28:19
1224
原创 【BootStrap】前端开发框架 | bootstrap栅格系统
Bootstrap是一个开源的前端开发框架,用于帮助开发者快速设计和开发响应式、移动优先的网页。它由Twitter的开发者 Mark Otto 和 Jacob Thornton 在 2011 年创建,目的是为了让网页开发变得更加简单和高效。框架: 顾名思义就是有一套比较完整的解决方案,而且控制权再框架本身,有预制样式库、组件和插件。使用者要按照框架所规定的某种规范进行开发!
2025-04-01 01:50:29
1040
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人