一步步编写avalon组件02：分页组件

本章节，我们做分页组件，这是一个非常常用的组件。grid, listview都离不开它。因此其各种形态也有。然后建webpack.config开始构建工程：var webpack = require('webpack');var path = require('path');function heredoc(fn) {return fn.toString().replace

业界 2016年06月28日

一步步编写avalon组件03：切换卡组件

经过几个星期的升级， 我终于又腾出空来继续这个教程.本章主要是讲解avalon的插槽元素的使用，并且应用更强大的webpack.config。webpack 真是好强大，好灵活，我也是从社区那里学到这些新招数的！本章讲授的主体是切换卡，也就是tabs。切换卡的原理很好简单，就是存在一个点击区与一个显示区。点击区我们通常称之为buttons或triggers，显示区我们称之为

业界 2016年07月17日

avalon如何在移动端使用

移动端与PC端最大的区别是事件系统不一样，并且移动端上的浏览器对新API支持比较好。因为我们可以用avalon.modern.js作为核心，加上移动事件构建avalon.mobile.avalon2在这个目录下提供了许多事件，并不是我们都会用到的。因此挑选用到的模块加上就行。比如我们用到swipe事件。点击下载zip，然后打开src 文件夹，建一个avalon.mobile

业界 2016年07月20日

avalon2组件的相关概念详解

[TOC]avalon拥有两大利器，强大的组件化功能以应对复杂墙问题，顶级的虚拟DOM机制来解决性能墙问题。组件可谓是指令的集合，但1＋1 > 2!组件容器组件容器是一个占位用的元素节点. 当avalon扫描到此位置上时将它替换成组件.在avalon2中有4类标签可以用作组件容器,分别是wbr, xmp, template, 及ms-开头的自定义标签.其兼容性如下元素类

业界 2016年07月30日

一步步编写avalon组件04：GRID组件

grid组件（表格）是非常常用的组件，尤其是后台系统。它的制定也是五花八门的。因此jQuery有大量的grid组件，每个都庞大无比，集成各种功能，复杂得像Excel。但即便是这样，我们的产品经理总是能提出一些需求，让你死去活来。因此有时我们不需要一个功能丰富的grid，而是一个扩展性极好的grid。avalon2强大的组件机制就此而生。我们分析一下grid的结构。通常就是一

业界 2016年08月04日

一步步编写avalon组件05：树组件

给人印象中，树组件是非常令人畏惧的一个组件，超级复杂，超级难写。但使用avalon2来做，这却是级其简单的一件事。首先从样式入做，无序列表是天然可用的树结构，几个UL元素套在一起，它们就自然处理好缩进问题。换言之，我们用UL元素作为树的节点，那么树组件内部也需要存在树组件，需要形成递归结构。avalon2的slot机制又是出场的时候了。因此我们的树的结构大概是树子树子树子树

业界 2016年08月06日