关于指令(directive) 属性绑定.事件绑定和v-modal底层都是通过指令(directive)实现的,那么什么是指令呢?我们一起看看Directive的定义吧. //文件 ./src/directives/index.ts export interface Directive<T = Element> { (ctx: DirectiveContext<T>): (() => void) | void } 指令(directive)其实就是一个接受参数类型为Direc…
前言 双向绑定v-model不仅仅是对可编辑HTML元素(select, input, textarea和附带[contenteditable=true])同时附加v-bind和v-on,而且还能利用通过petite-vue附加给元素的_value._trueValue和_falseValue属性提供存储非字符串值的能力. 深入v-model工作原理 export const model: Directive< HTMLInputElement | HTMLSelectElement | HTM…
在书写petite-vue和Vue最舒服的莫过于通过@click绑定事件,而且在移除元素时框架会帮我们自动解除绑定.省去了过去通过jQuery的累赘.而事件绑定在petite-vue中就是一个指令(directive),和其他指令类似. 深入v-on的工作原理 walk方法在解析模板时会遍历元素的特性集合el.attributes,当属性名称name匹配v-on或@时,则将属性名称和属性值压入deferred队列的队尾,当当前元素所有属性绑定和v-modal处理后以及子元素所有属性绑定.v-mo…
引言 对于Spark开发人员来说,了解stage的划分算法可以让你知道自己编写的spark application被划分为几个job,每个job被划分为几个stage,每个stage包括了你的哪些代码,只有知道了这些之后,碰到某个stage执行特别慢或者报错,你才能快速定位到对应的代码,对其进行性能优化和排错. stage划分原理与源码 接着上期内核源码(五)的最后,每个action操作最终会调用SparkContext初始化时创建的DAGSchedule的runJob方法创建一个job: 那么…
本文主要抽离Vue源码中数据双向绑定的核心代码,解析Vue是如何实现数据的双向绑定 核心思想是ES5的Object.defineProperty()和发布-订阅模式 整体结构 改造Vue实例中的data,通过Object.defineProperty()将其所有属性设置为访问器属性 对每个属性添加Observer,并在observer中添加订阅者对象序列Dep 添加订阅者对象Watcher,每次初始化的时候添加到对应data属性中的Dep之中 所有,我们从代码的角度将整体分为三个部分:监听数据变…
有一段时间没有更新技术博文了,因为这段时间埋下头来看Vue源码了.本文我们一起通过学习双向绑定原理来分析Vue源码.预计接下来会围绕Vue源码来整理一些文章,如下. 一起来学Vue双向绑定原理-数据劫持和发布订阅 一起来学Vue模板编译原理(一)-Template生成AST 一起来学Vue模板编译原理(二)-AST生成Render字符串 一起来学Vue虚拟DOM解析-Virtual Dom实现和Dom-diff算法 这些文章统一放在我的git仓库:https://github.com/yzsun…
问题起源 使用SpringCloud构建项目时,使用Swagger生成相应的接口文档是推荐的选项,Swagger能够提供页面访问,直接在网页上调试后端系统的接口, 非常方便.最近却遇到了一个有点困惑的问题,演示接口示例如下(原有功能接口带有业务实现逻辑,这里简化了接口): /** * @description: 演示类 * @author: Huang Ying **/ @Api(tags = "演示类") @RestController @Slf4j public class Dem…
在petite-vue中我们通过reactive构建上下文对象,并将根据状态渲染UI的逻辑作为入参传递给effect,然后神奇的事情发生了,当状态发生变化时将自动触发UI重新渲染.那么到底这是怎么做到的呢? @vue/reactivity功能十分丰富,而petite-vue仅使用到reactive和effect两个最基本的API,作为入门本文将仅仅对这两个API进行源码解读. 一切源于Proxy 我们知道Vue2是基于Object.defineProperty拦截对象属性的读写操作,从而实现依赖…
1. 前言 博主作为一名前端开发,日常开发的技术栈是Vue,并且用Vue开发也有一年多了,对其用法也较为熟练了,但是对各种用法和各种api使用都是只知其然而不知其所以然,因此,有时候在排查bug的时候就会有点捉襟见肘.鉴于此,索性就从github上clone下来一份Vue源码来学习学习,本系列博文将用来记录博主对Vue源码的整个学习过程,以及自己对源码的一些理解.一方面开阔自己的知识视野,另一方面也希望这些文字能够带给他人些许帮助. 2. 学习规划 2.1 源码学习目录 本项目所分析的Vue.j…
俗话说的好,牵牛要牵牛鼻子 驾车顶牛,处理复杂的东西,只要抓住重点,才能理清脉络,不至于深陷其中,不能自拔.对复杂的nginx而言,main函数就是“牛之鼻”,只要能理清main函数,就一定能理解其中的奥秘,下面我们就一起来研究一下nginx的main函数. 1.nginx的main函数解读 nginx启动显然是由main函数驱动的,main函数在在core/nginx.c文件中,其源代码解析如下,涉及到的数据结构在本节仅指出其作用,将在第二节中详细解释. nginx main函数的流程图如下:…