el-input是element ui中使用最频繁的组件之一了,分析其构成从四个方面入手:DOM结构,属性,样式,事件入手 DOM结构: <div> <input /> </div> 结构很简单,这就相当于一个主干,剩下的样式,事件,属性都在这个基础上扩充 属性: 既然是封装,input原生的属性基本上都要覆盖到,个人猜测element团队是按照w3c官方资料来整理的,这样绝对保证不遗漏,这种方式很值得借鉴,如下: // 兼容文本框和文本域的情况 <templat…

要看源码就得从最简单的开始,button够简单的了,就从他开始吧. 安装依赖后源码目录在:node_modules/element-ui/packages中,可以看到这里的文件夹命名是不是很熟悉,就是我们平时写的组件名,打开任何一个文件夹,都有一个src文件夹和一个index.js,src文件夹放组件,index.js用于注册组件 下面来看具体的button源码如何写的: 分析从三个方面着手:DOM结构,数据属性,事件 DOM结构: 按钮的DOM结构很简单,要显示成什么样子就由css样式及一些自…

参考博客:https://segmentfault.com/a/1190000014384638?utm_source=tag-newest…

上篇问题 在上篇<iview源码解析(1)>中的index.js 入口文件的源码中有一段代码有点疑惑: /** * 在浏览器环境下默认加载组件 */ // auto install if (typeof window !== 'undefined' && window.Vue) { install(window.Vue); } 在引用 iview 组件的时候需要 Vue.use(iView, { locale }); 注册组件,即使不执行 use 也把组件注册了,这两段代码不是…

写在前面 一个好的架构需要经过血与火的历练,一个好的工程师需要经过无数项目的摧残. vuejs是一个优秀的前端mvvm框架,它的易用性和渐进式的理念可以使每一个前端开发人员感到舒服,感到easy.它内部的实现机制值得让我们深究,比如obServer的实现原理,为什么vue能够实现组件化等等,我们需要理解它内部的运行机制,代码结构,这样才能更深入的理解vue的优秀之处,能更好的贴合业务实际写出更恰当的代码. 说明: 在展开本章之前,博主需要对自己看的源码文件进行一个简短的说明: 博主最终选择首先阅…

作为MVC框架,M(odel)  V(iew)  C(ontroler)之间的联系是必不可少的,今天要说的就是View(视图) 通常我们在写逻辑代码也好或者是在ui组件也好,都需要跟dom打交道,我们好讨厌在逻辑代码里面参杂dom的代码,特别是需要生产dom的代码, 因为这样的缺点: 1. 耦合,难于维护(虽然模版引擎能解决一些问题,但是事件的添加呢?) 2. 代码无法做到美观,节俭,感觉和dom参杂在一起就是一个字,乱!! 介于这样的缺点,Backbone提供了一个View类,用于构造对象,它…

Github源码地址:https://github.com/wyouflf/xUtils3 原文地址 :http://www.codekk.com/blogs/detail/54cfab086c4761e5001b2543 本文为 Android 开源项目源码解析 中 xUtils 部分.项目地址:xUtils,分析的版本:192c2a886c,Demo 地址:xUtils Demo分析者:Caij,校对者:maogy,校对状态:未完成 1. 功能介绍 xUtils 一个 Android 公共库…

[原]Android热更新开源项目Tinker源码解析系列之一:Dex热更新 Tinker是微信的第一个开源项目,主要用于安卓应用bug的热修复和功能的迭代. Tinker github地址:https://github.com/Tencent/tinker 首先向微信致敬,感谢毫无保留的开源出了这么一款优秀的热更新项目. 因Tinker支持Dex,资源文件及so文件的热更新,本系列将从以下三个方面对Tinker进行源码解析: Android热更新开源项目Tinker源码解析系列之一:Dex热更…

jQuery2.x源码解析(构建篇) jQuery2.x源码解析(设计篇) jQuery2.x源码解析(回调篇) jQuery2.x源码解析(缓存篇) 缓存是jQuery中的又一核心设计,jQuery自身的很多东西都依赖于缓存,比如事件.一些中间变量.动画等.同时他还为用户提供接口了使用缓存的接口,方便用户在元素节点上保存自己的数据,并且帮助用户解决直接把数据保存到DOM元素是可能引起的内存泄漏.命名冲突等问题. 同时,html5提出了一种通过属性缓存元素数据的功能,就是data-*属性,他可以…

本文主要介绍EventBus3.0的源码 EventBus是一个Android事件发布/订阅框架,通过解耦发布者和订阅者简化 Android 事件传递. EventBus使用简单,并将事件发布和订阅充分解耦,从而使代码更简洁. 本文主要从以下几个模块来介绍 1.EventBus使用 2.EventBus注册源码解析 3.EventBus事件分发解析 4.EventBus取消注册解析   一.EventBus使用 1.首先是注册 EventBus.getDefault().register(thi…