vue
文章平均质量分 90
顽皮宝
道阻且长,行则将至
展开
-
【Vue3源码Runtime-core篇】 第二章初始化Component
上一篇文章讲了整个包的核心逻辑,以及patch算法流程图流程图:render函数内patch算法和的流程,这一章就开始实现整个流程,我们只要按着流程去创建函数就可以了。原创 2024-01-17 12:45:08 · 1206 阅读 · 0 评论 -
【Vue3源码Runtime-core篇】 第一章 初识Runtime
当设计一个框架的时候,我们有三种选择:纯运行时的、运行时 + 编译时的或纯编译时的。我们先聊聊纯运行时的框架。原创 2023-03-30 23:10:31 · 667 阅读 · 0 评论 -
【Vue3源码】第七章 computed的实现
【Vue3源码】第六章 computed的实现上一章节我们实现了 ref 及其它配套的isRef、unRef 和 proxyRefs API。这一章开始实现computed计算属性。原创 2024-01-17 12:45:13 · 1308 阅读 · 0 评论 -
Vue3响应式原理以及依赖模型解析
在看一些关于Vue的资料时,经常都能看到依赖收集和依赖更新的字样,那么什么是依赖?export type Dep = Set < ReactiveEffect > & TrackedMarkers // 依赖定义 type TrackedMarkers = {可以看出来,依赖本质上就是一个ReactiveEffect的Set集合。关于TrackedMarkers参数,在介绍依赖收集优化时分析。Vue3响应式系统的总结到此结束,后续会逐步更新关于Vue3的其他系统模块。作者:sunsetFeng。转载 2024-01-17 12:45:19 · 743 阅读 · 0 评论 -
【Vue3源码】第六章 ref的原理 实现ref
【Vue3源码】第五章 ref的原理 实现ref上一章节我们实现了reactive 和 readonly 嵌套对象转换功能,以及shallowReadonly 和isProxy几个简单的API。这一章我们开始实现 ref 及其它配套的isRef、unRef 和 proxyRefs。原创 2023-02-23 22:05:32 · 1856 阅读 · 2 评论 -
【Vue3源码】第五章 实现 reactive 和 readonly 嵌套对象绑定响应式
上一章节我们实现了isReadonly和isReactive两个API。还记得第一章时说的proxy无法代理嵌套对象形成响应式的问题吗?这一章我们实现 reactive 和 readonly 嵌套对象转换功能,以及shallowReadonly 和isProxy几个简单的API。原创 2024-01-17 12:45:25 · 1237 阅读 · 0 评论 -
【JavaScript】js实现深拷贝的方法
在js中我们想要实现深拷贝,首先要了解深浅拷贝的区别。浅拷贝:只是拷贝数据的内存地址,而不是在内存中重新创建一个一模一样的对象(数组)深拷贝:在内存中开辟一个新的存储空间,完完全全的拷贝一整个一模一样的对象(数组)原创 2023-02-20 20:14:19 · 1087 阅读 · 0 评论 -
【Vue3源码】第二章 effect功能的完善补充
上一章节我们实现了effect函数的功能stop和onstop,这次来优化下stop功能。原创 2024-01-17 12:45:34 · 764 阅读 · 0 评论 -
【Vue3源码】第四章 实现isReadonly和isReactive
上一章节我们实现readonlyAPI,并且优化之前写的reactiveAPI。这一章我们实现isReadonly和isReactive两个API。原创 2024-01-18 09:26:49 · 1602 阅读 · 0 评论 -
【Vue3源码】第三章 readonly详解 从零实现Vue3 readonly API
上一章节我们实现了effect函数的stop和onstop功能,至此effect函数源码的编写就暂时告一段落了,这一章我们继续解读Vue3源码,开始实现Vue3Reactivity:core 中的readonlyAPI,并且优化之前写的reactiveAPI。原创 2023-02-18 23:39:13 · 712 阅读 · 0 评论 -
【Vue3源码】第二章 effect功能的完善下
上一章节我们实现了effect函数的runner 和 scheduler,这一章我们继续完善effect函数的功能,stop和onstop。原创 2023-02-17 22:05:24 · 603 阅读 · 0 评论 -
【Vue3源码】第二章 effect功能的完善上
上一章节我们实现了基础版本的effect函数,和reactive函数已经依赖收集和依赖触发函数,这一章我们继续完善effect函数的功能。原创 2024-01-17 12:45:39 · 1279 阅读 · 0 评论 -
【Vue3源码】第一章 effect和reactive
今天就正式开始Vue3源码学习了,那么很多初学者(包括我)在看vue源码时都会非常迷茫不知从何下手,所以我们在学习源码时应该反其道而行之,剔除掉源码中包括Tree-Shaking、TypeScript类型约束、特性开关、错误处理等操作,只了解其核心原理,大大提高学习效率减少学习成本!原创 2023-02-12 14:40:39 · 1338 阅读 · 3 评论 -
【nuxt2/nuxt3】@nuxtjs/i18n国际化
在网上阅读的大部分案例都还在使用vue-i18n插件做教程,实际上nuxt本身就已经基于vue-i18n封装了插件。而且它比vue-i18n封装了更多好用的功能,具体的使用方法我们可以查看但是官方好像没有做中文翻译,所以我在这里出了一篇中文教程,第一这个插件比vue-i18n用起来更方便,第二中文教程也方便大家快速使用上这个插件。原创 2022-12-09 23:00:59 · 8029 阅读 · 17 评论 -
【JavaScript】vue中的响应式原理
在搞懂Vue2 - Vue3 响应式原理前,我们首先要认识JavaScript中的Object.defineProperty、Proxy、map、weakMap、Set、Reflect这几个知识点。如果已经明白这些知识点,我们可以直接导航跳到"响应式原理"。原创 2024-01-18 09:27:32 · 1137 阅读 · 0 评论 -
vite配置cdn优化打包体积
大家都知道前端性能优化的方法,cdn外部引入的方法可以使项目打包后体积大大缩小,所以是前端性能优化方面非常推荐的方法之一。本文关于项目如何cdn引入做一个简单教程,我们可以通过两种方式引入配置cdn。由于vite的核心基于rollup和webpack不同,所以cdn引入方式也不同具体rollup配置项可以阅读vite官网。rolluppluginsexternalvite这次带来了两种方法打包Element plus ,同样的只要有cdn链接,我们就可以用这两种方式进行引入。原创 2022-09-13 11:44:26 · 9307 阅读 · 6 评论 -
【全栈开发】vue3响应式音乐播放器博客 - 热浪网
从立项到上线其实已经过了 4个月了,靠着碎片时间开发的一个博客网站,包括购买服务器,网站备案等一整套流程下来,项目耗时曲线也被拉长,不过功夫不负有心人,时间冉冉——趁着九月初中秋节这个热浪余波未了,Heat Waves ♨️ 🌊 1.0版本也终于正式上线!!文章结尾会附上浏览链接这是一个通过全栈开发的一个极简风响应式多功能音乐播放器+知识博客web(单人役原创 2022-09-12 22:07:51 · 1268 阅读 · 5 评论 -
vue2 vue3 全局变量和函数
本篇文章主要介绍了 vue2 和 vue3的全局变量和函数应用,包括。原创 2022-09-06 20:30:48 · 1545 阅读 · 0 评论 -
vue动态引入图片
这篇文章主要介绍了关于vue图片路径的处理问题,在我们想要动态加载图片路径时,由于vue的打包原理不同,我们也有不同的处理图片路径方法,希望对大家有所帮助。如有错误或未考虑完全的地方,望各位斧正。...原创 2022-08-29 20:07:30 · 9496 阅读 · 1 评论 -
【vue组件封装】根据页面滚动高亮显示目录的侧边栏
现在可以说整个的大前端开发都是组件化的天下,无论从三大框架(Vue、React、Angular),还是跨平台方案的Flutter,甚至是移动端都在转向组件化开发。所以,学习组件化最重要的是它的思想,每个框架或者平台可能实现方法不同,但是思想都是一样的。......原创 2022-07-26 22:30:00 · 2919 阅读 · 14 评论