写Vue最常用的就是各种交互事件,各种v-on:xxx比如DOM事件click、hover,还有自定义的那些更加乱七八糟。
不同于React,Vue里的事件是否为自定义事件,是按照是否写在组件标签上来区分的。如果是组件,除加额外的:native等属性,否则一众事件都使用$on/$emit的模式来调用,哪怕是on:click这些DOM事件。如果是普通tag,哪怕是自定义事件,也会以addEventListener ...
组件(Component)是Vue一个重要的功能。一般用于包装可重用代码,或者是定义高级组件。对于小型项目,(可能)会增强代码的结构性,但是并非必须。对于稍大型的项目,它则是模块化的基础,也是代码拆分常用的形式。
组件有很多内容,比如组件消息传递、数据传递、slot、异步组件等等,作为一个有品味的博主,以上内容本篇统统不涉及。本篇只从一个注册+创建角度 ...
因为最近在用Vue,所以想把代码看一下,我觉得,越多的了解运行机制,越能更好的解决问题和……避坑。
本文必须提前要了解的两个概念是:defineProperty特性,观察者模式。
我们以一个简单的结构来开始
123456
new Vue({ el: '#app', data: {   ...
一般在公司环境使用中,各种前端框架都会用一下,因为不同框架理念和使用场景有些许区别,有的重规模化,有的追求轻便易上手;有的模块化程度很高,有的通常全部写一起;有的规则安排的明明白白,有的又需要各种语法糖……虽然最近几个月工作特别忙,但是还是拿出了一点点时间来扩充一下Vue的背景知识。
为什么组件的data属性必须是函数?
在自定义模块的新手上路 ...
上一篇留了一个代理Proxy没覆盖到,因为之前没怎么使用过,所以这篇补充一下相关内容。
Proxy用于定义基本操作自定义行为(比如:属性查找get,赋值set,枚举、函数调用等)。使用Proxy代理,可以在目标对象(target)进行操作之前,进行过滤和额外操作。
Proxy基本使用
1
var p = new Proxy(target, ...
事件也是React里使用频率很高的操作,各种onClick、onFocus/onBlur、onChange、onSubmit都是经常使用的。事件触发同样是update,也会使用ReactUpdates.batchedUpdates流程,所以会用到前面文章中的内容。
还是以之前的Hello为例,这次给div添加onClick函数事件,函数名为clickFunc。完整代码如下
12345678910111213 ...
在【React-简单组件的挂载(mount)过程】的2.6)里提到了组件最后从ReactElement到HTML-DOM的转换过程,但是没展开。本周趁着还熟,这篇填坑。
首先,简单画一下本篇的数据结构
前面挂载一篇说过,从ReactCompositeComponent一步一步调用mountComponent,最后会到最内层的ReactDomComponent.mountComponent,本篇直接从这里往下面走。
...
setState是React里使用频率最高的的一个操作,React的状态更新,不同于vue的直接this.data设置,需要都要通过这个函数进行。
在使用中,总结setState的3个特性:
1、异步更新,即调用setState之后立刻获取更新值,通常不会取到最新的值;
2、合并更新,例如在不同的生命周期(componentWillMount、omponentDidMount等)进行的状态更新,最终只会触发一次;
3、可 ...