首页
AI Coding
NEW
沸点
课程
直播
活动
AI刷题
APP
插件
搜索历史
清空
创作者中心
写文章
发沸点
写笔记
写代码
草稿箱
创作灵感
查看更多
会员
登录
注册
确定删除此收藏集吗
删除后此收藏集将被移除
取消
确定删除
确定删除此文章吗
删除后此文章将被从当前收藏集中移除
取消
确定删除
编辑收藏集
名称:
描述:
0
/100
公开
当其他人关注此收藏集后不可再更改为隐私
隐私
仅自己可见此收藏集
取消
确定
Element 源码
订阅
admln52
更多收藏集
微信扫码分享
微信
新浪微博
QQ
15篇文章 · 0订阅
Element源码分析系列1一Layout(布局)
打开index.js,这里最后一句导出Row供我们import,而中间的install方法则是把这个组件当成一个Vue的插件来使用,通过Vue.use()来使用该组件,install方法传递一个Vue的构造器,Element的所有组件都是一个对象{...},里面有个render…
Element源码分析系列7-InputNumber(数字输入框)
这里的意思是当controls-right类被加上后,decrease这个类的css变化为上面的内容,也就是将减按钮从原本的左侧放置到右下角,我开始不明白这里的top:auto,left:auto是干嘛的,后来控制台调试得知,因为decrease类原本的top是1px,left…
Element-UI 技术揭秘(5)- 色彩、字体、边框与图标
element-ui 组件库之所以受欢迎,除了组件丰富,文档友好之外,还得益于它的精美的设计。之前在组件库的整体设计文章中提到,element-ui 背后有一只强大的设计团队,他们为组件库了制定了一套设计规范。 当我们去设计一套组件库的时候,首先要考虑颜色、字体、边框、图标这些…
Element-UI 技术揭秘(1)- 前言
如果你用 Vue 技术栈开发 PC 的 to B 业务,那么对 element-ui 一定不会陌生,我目前在 Zoom 工作,fork 了一份 element-ui 的源码做二次开发,对 element-ui 的源码也有了一定的研究。由于自研组件库并不是开源的,所以我也不能把它…
Element源码分析系列2-Container(布局容器)
它是一个3元运算符,首先判断this.$slots&& this.$slots.default,如果不存在直接返回false,不存在的情况就是子元素为空。this.$slots是组件的实例属性,组件是可复用的Vue的实例,和 new Vue()一样是实例,因此有以下属性 因此这…
Element-UI 技术揭秘(4)— Container 布局容器组件的设计与实现。
上一篇文章我们分析了 Layout 布局组件的设计和实现,它的应用场景通常是局部布局。对于整个页面的布局,element-ui 提供了 Container 布局容器组件,专门用于 PC 管理后台页面的整体布局。 我们先通过几幅图看一下页面的常见布局。 这两张图的布局在后台系统中…
Element-UI 技术揭秘(2)- 组件库的整体设计
当我们去实现一个组件库的时候,并不会一上来就撸码,而是把它当做产品一样,思考一下我们的组件库的需求。那么对于 element-ui,除了基于 Vue.js 技术栈开发组件,它还有哪些方面的需求呢。 丰富的 feature:丰富的组件,自定义主题,国际化。 文档 & demo:提…
聊聊 Vue 中 provide/inject 的应用
众所周知,在组件式开发中,最大的痛点就在于组件之间的通信。在 Vue 中,Vue 提供了各种各样的组件通信方式,从基础的 props/$emit 到用于兄弟组件通信的 EventBus,再到用于全局数据管理的 Vuex。 在这么多的组件通信方式中,provide/inject …
Element源码分析系列6-Checkbox(复选框)
简介复选框的逻辑比单选框更为复杂,代码量也更多,这里只介绍其与单选框不同的逻辑,其余的分析参考单选框先上代码,官网代码点此是不是看的一脸懵逼,最好是打开官网,对照checkbox用法一项项来分析其原理
Element源码分析系列3-Button(按钮)
我们一步步分析,首先很明确,<el-button>就是封装了原生的button而已,原生button有个地方需要注意,请始终为 <button> 元素规定 type 属性。不同的浏览器对 <button> 元素的 type 属性使用不同的默认值,值有3种,button,subm…