摘要: 1.动态组件 <component :is='组件名'></component> 结合v-for循环使用 使用环境 如图,这是一个v-for渲染的列表(只是目前这个版块才刚开始做,目前只有一个),圆圈内的就是一个组件,也就是要v-for动态组件 实际使用 一开始就是基本的组件引入了 import C 阅读全文
posted @ 2022-11-02 09:32 yyds2026 阅读(26) 评论(0) 推荐(0)
摘要: 知道大家使用 Vue3 的时候有没有这样的疑惑,“ref、rective 都能创建一个响应式对象,我该如何选择?”,“为什么响应式对象解构之后就失去了响应式?应该如何处理?” 今天咱们就来全面盘点一下 ref、reactive,相信看完你一定会有不一样的收获,一起学起来吧! reactive() 基 阅读全文
posted @ 2022-11-01 12:52 yyds2026 阅读(129) 评论(0) 推荐(0)
摘要: 混入mixins 官方解释 混入 (mixin) 提供了一种非常灵活的方式,来分发 Vue 组件中的可复用功能。一个混入对象可以包含任意组件选项。当组件使用混入对象时,所有混入对象的选项将被“混合”进入该组件本身的选项。 简单的来说就是 Mixins 是我们可以重用的代码块,在实际开发中,如果有些代 阅读全文
posted @ 2022-11-01 12:47 yyds2026 阅读(51) 评论(0) 推荐(0)
摘要: 准备:自定义指令介绍 除了核心功能默认内置的指令 (v-model 和 v-show等),Vue 也允许注册自定义指令。注意,在 Vue2.0 中,代码复用和抽象的主要形式是组件。然而,有的情况下,你仍然需要对普通 DOM 元素进行底层操作,这时候就会用到自定义指令。 ———Vue官网 作为使用Vu 阅读全文
posted @ 2022-11-01 12:46 yyds2026 阅读(98) 评论(0) 推荐(0)
摘要: 这一章我们开始讲模板解析编译:总结来说就是通过compile函数把tamplate解析成render Function形式的字符串compiler/index.js import { parse } from './parser/index' import { optimize } from './ 阅读全文
posted @ 2022-10-31 10:11 yyds2026 阅读(25) 评论(0) 推荐(0)
摘要: 我们先来关注一下$mount是实现什么功能的吧: 我们打开源码路径core/instance/init.js: export function initMixin (Vue: Class<Component>) { ...... initLifecycle(vm) // 事件监听初始化 initEv 阅读全文
posted @ 2022-10-31 10:09 yyds2026 阅读(114) 评论(0) 推荐(0)
摘要: 先来看生成虚拟dom的入口文件: ... import { parse } from './parser/index' import { optimize } from './optimizer' import { generate } from './codegen/index' ... cons 阅读全文
posted @ 2022-10-31 10:08 yyds2026 阅读(28) 评论(0) 推荐(0)
摘要: 这一章就着重讲两个点: 响应式系统如何收集依赖 响应式系统如何更新视图 我们知道通过Object.defineProperty做了数据劫持,当数据改变的时候,get方法收集依赖,进而set方法调用dep.notify方法去通知Watcher调用本身update方法去更新视图。那么我们抛开其他问题,就 阅读全文
posted @ 2022-10-27 15:17 yyds2026 阅读(40) 评论(0) 推荐(0)
摘要: 键盘事件 在 js 中我们通常通过绑定一个事件,去获取按键的编码,再通过 event 中的 keyCode 属性去获得编码 如果我们需要实现固定的键才能触发事件时就需要不断的判断,其实很麻烦 let button = document.querySelector('button') button.o 阅读全文
posted @ 2022-10-27 15:16 yyds2026 阅读(54) 评论(0) 推荐(0)
摘要: 模板tamplate经过parse,optimize,generate等一些列操作之后,把AST转为render function code进而生成虚拟VNode,模板编译阶段基本已经完成了,那么这一章,我们来探讨一下Vue中的一个算法策略--dom diff 首先来介绍下什么叫dom diff 什 阅读全文
posted @ 2022-10-26 14:33 yyds2026 阅读(83) 评论(0) 推荐(0)