yyzzabc123

2022年10月24日

摘要：例子代码本篇将要讲解dom diff，那么咱们结合下面的例子来进行讲解，这个例子是在上一篇文章的基础上，加了一个数据变更，也就是list的值发生了改变。html中增加了一个按钮change，通过点击change按钮来调用change函数，来改变list的值。例子位于源代码/packages/vue 阅读全文

posted @ 2022-10-24 18:28 yyzzabc123 阅读(93) 评论(0) 推荐(0)

Vue源码解读之InitState

摘要：前面我们讲到了_init函数的执行流程，简单回顾下：初始化生命周期-initLifecycle 初始化事件-initEvents 初始化渲染函数-initRender 调用钩子函数-beforeCreate 初始化依赖注入-initInjections 初始化状态信息-initState 初始化依阅读全文

posted @ 2022-10-24 18:25 yyzzabc123 阅读(29) 评论(0) 推荐(0)

2022年10月19日

vue源码分析-响应式系统工作原理

摘要：上一章，我们讲到了Vue初始化做的一些操作，那么我们这一章来讲一个Vue核心概念响应式系统。我们先来看一下官方对深入响应式系统的解释: 当你把一个普通的 JavaScript 对象传给 Vue 实例的 data 选项，Vue 将遍历此对象所有的属性。并使用 Object.defineProper 阅读全文

posted @ 2022-10-19 14:52 yyzzabc123 阅读(29) 评论(0) 推荐(0)

vue源码分析-从new Vue开始

摘要：初学vue，你得知道我们是从new Vue开始的： new Vue({ el: '#app', data: obj, ... }) 那你觉得是不是很有意思，咱们new Vue之后，就可以使用他那么多的功能,可见Vue是暴出来的一个一个功能类函数，我们进入源码一探究竟： import Vue from 阅读全文

posted @ 2022-10-19 14:43 yyzzabc123 阅读(27) 评论(0) 推荐(0)

vue源码分析-keep-alive原理（上）

摘要：上一节最后稍微提到了Vue内置组件的相关内容，从这一节开始，将会对某个具体的内置组件进行分析。首先是keep-alive，它是我们日常开发中经常使用的组件，我们在不同组件间切换时，经常要求保持组件的状态，以避免重复渲染组件造成的性能损耗，而keep-alive经常和上一节介绍的动态组件结合起来使用。阅读全文

posted @ 2022-10-19 14:29 yyzzabc123 阅读(94) 评论(0) 推荐(0)

vue源码分析-动态组件

摘要：前面花了两节的内容介绍了组件，从组件的原理讲到组件的应用，包括异步组件和函数式组件的实现和使用场景。众所周知，组件是贯穿整个Vue设计理念的东西，并且也是指导我们开发的核心思想，所以接下来的几篇文章，将重新回到组件的内容去做源码分析，首先会从常用的动态组件开始，包括内联模板的原理，最后会简单的提到内阅读全文

posted @ 2022-10-19 14:17 yyzzabc123 阅读(59) 评论(0) 推荐(0)

2022年10月18日

vue源码分析-diff算法核心原理

摘要：这一节，依然是深入剖析Vue源码系列，上几节内容介绍了Virtual DOM是Vue在渲染机制上做的优化，而渲染的核心在于数据变化时，如何高效的更新节点，这就是diff算法。由于源码中关于diff算法部分流程复杂，直接剖析每个流程不易于理解，所以这一节我们换一个思路，参考源码来手动实现一个简易版的d 阅读全文

posted @ 2022-10-18 17:02 yyzzabc123 阅读(47) 评论(0) 推荐(0)

vue源码分析-事件机制

摘要：这个系列讲到这里，Vue基本核心的东西已经分析完，但是Vue之所以强大，离不开它提供给用户的一些实用功能，开发者可以更偏向于业务逻辑而非基本功能的实现。例如，在日常开发中，我们将@click=***用得飞起，但是我们是否思考，Vue如何在后面为我们的模板做事件相关的处理，并且我们经常利用组件的自定义阅读全文

posted @ 2022-10-18 16:53 yyzzabc123 阅读(33) 评论(0) 推荐(0)

vue源码分析-插槽原理

摘要： Vue组件的另一个重要概念是插槽，它允许你以一种不同于严格的父子关系的方式组合组件。插槽为你提供了一个将内容放置到新位置或使组件更通用的出口。这一节将围绕官网对插槽内容的介绍思路，按照普通插槽，具名插槽，再到作用域插槽的思路，逐步深入内在的实现原理,有对插槽使用不熟悉的，可以先参考官网对插槽的介绍。阅读全文

posted @ 2022-10-18 16:48 yyzzabc123 阅读(108) 评论(0) 推荐(0)

vue源码分析-v-model的本质

摘要：双向数据绑定这个概念或者大家并不陌生，视图影响数据，数据同样影响视图，两者间有双向依赖的关系。在响应式系统构建的上，中，下篇我已经对数据影响视图的原理详细阐述清楚了。而如何完成视图影响数据这一关联？这就是本节讨论的重点：指令v-model。由于v-model和前面介绍的插槽，事件一致，都属于vue 阅读全文

posted @ 2022-10-18 16:42 yyzzabc123 阅读(77) 评论(0) 推荐(0)

公告