Module模块
Module模块是封装好的class类，这些模块通常功能单一、通用，并且支持一系列的操作方法；模块的重要意义是方便其他组件或模块引用，也方便用户基于这些module模块进行再次封装，例如Popup、Position、Dialog、Alert、Valid等模块；Module模块主要分三类，一类是有节点宿主的，例如Drawer；二类是有数据宿主的，例如Observe；三类是其他参数未定型的模块，例如Popup有三个参数（宿主节点、气泡节点和模块参数）
使用方式
模块是Class类，需要通过new方法实例化才可使用，例如More模块，可以通过new ax.More('#id')创建实例。
模块根据宿主类型分为：节点型模块，数据型模块和其他行模块。
节点型模块有两个参数，第一个参数都是节点选择器，第二个参数是实例选项，例如More模块就是节点型模块。本框架的模块主要是节点型模块。
数据型模块有两个参数，第一个参数是数据（数组或对象），第二个参数是实例选项，例如Observe模块就是数据行模块。
其他模块的参数数量可能就不确定了，而且参数的数据类型也不能确定，例如Position模块包含三个参数，第一个和第二个参数均是节点选择器，第三个参数是实例选项。
- 输出
- HTML
- JS
-
中国是世界四大文明古国之一，有着悠久的历史，距今约5000年前，以中原地区为中心开始出现聚落组织进而形成国家，后历经多次民族交融和朝代更迭，直至形成多民族国家的大一统局面。
-
-
new ax.More('#mo01');
通过属性实例化
本框架的节点型模块比较多，节点型模块除了可以通过new实例化，也可以使用属性实例化，例如可以通过<ul ax-more></ul>属性的方式执行Menu实例化。
节点元素的属性不区分大小写，ax-more、ax-More和AX-MORE结果一致。
- 输出
- HTML
-
中国是世界四大文明古国之一，有着悠久的历史，距今约5000年前，以中原地区为中心开始出现聚落组织进而形成国家，后历经多次民族交融和朝代更迭，直至形成多民族国家的大一统局面。
-
通过自定义标签实例化
节点型模块又细分为两类：
- 节点本身就是内容，例如More便可以将数据放在目标节点内。
- 目标节点和内容分离，例如Popup则需要通过其他途径获得内容。
针对第一种类型，本框架创建了Webcomponent自定义标签组件，例如ax-more、ax-menu、ax-tab等组件，使他们用起来更加方便。
- 输出
- HTML
-
中国是世界四大文明古国之一，有着悠久的历史，距今约5000年前，以中原地区为中心开始出现聚落组织进而形成国家，后历经多次民族交融和朝代更迭，直至形成多民族国家的大一统局面。 -
初始化
为了方便初始化所有的模块、组件和插件，应该将ax.js文件在页面的最底部引入。在ax.js文件的后方可通过在<script>标签放入初始化模的js代码以创建实例。
对于Webcomponent组件，只要引入了ax.js文件，自定义组件便会自动初始化，不管组件元素使在ax.js文件引用位置的前面还是后面。
如果需要使用属性来激活模块创建实例，则需要对ax.js做初始化处理。我们可以以这种方式引入js文件：<script src="ax.js" onload="ax.init()"></script>，意思就是在ax.js文件加载成功之后对所有使用模块属性的节点进行初始化实例化。
如果是动态创建带模块属性的标签，需要手动使用ax.init()方法激活。关于ax.init()的用法请点击这里。
公共参数
本框架的模块基于相同的编写方式，所以有相同的参数选项。
| 属性名 | 值类型 | 默认值 | 说明 |
|---|---|---|---|
| insName | string | '' | 实例名，如果填写了可通过ax.instance取得实例，查看ax.instance详细 |
| storName | string | '' | 数据缓存名称，如果填写了可自动保存参数 |
| storKeys | array | [] | 在填写了storName前提下，该参数将决定保存哪些参数 |
| breakpoints | object | {} | 在不同尺寸终端下使用不同的参数，查看ax.breakpoints详细 |
| lang | object | {} | 语言包，如果填写了将替换ax.lang中的值 |
公共事件
本框架的模块基于相同的编写方式，所以有相同的监听事件。
监听事件的使用方法有两种：
- 在参数内使用，例如：
new ax.Menu('#demo',{onReset:()=>{}}) - 通过
on方法链式使用，例如：new ax.Menu('#demo'，{}).on('reset',()=>{}).on('update',()=>{})
| 事件名 | 别名(参数内用) | 参数 | 返回值 | 说明 |
|---|---|---|---|---|
| ready | onReady | () | this | 完成构造函数后，未初始化之前执行 |
| start | onStart | () | this | 完成构造函数后，开始初始化之前执行 |
| init | onInit | () | this/AsyncFunction(可能) | 完成初始化后执行 |
| destroy | onDestroy | (item) | this | 实例销毁后执行 |
| reset | onReset | () | this | 参数重置后执行 |
| update | onUpdate | (settings) | this/AsyncFunction(可能) | 更新参数后执行 |
| save | onSave | (item) | this | 保存缓存后执行 |
| clearCache | onClearCache | () | this | 清除缓存后执行 |
公共变量
本框架的模块基于相同的编写方式，所以有相同的内部变量。
如果宿主是HTMLElement节点，那么会有targetEl，例如：ax.Menu模块；如果宿主是数组数据或对象数据，那么会有targetData，例如：ax.Observe模块。
storKeys、storTmp和storObs在启用options.storName之后才有值。
| 变量名 | 值类型 | 默认值 | 说明 |
|---|---|---|---|
| initCount | number | 0 | 初始化次数 |
| targetData | array | [] | 目标数据（宿主为data类型时有值） |
| targetEl | HTMLElement | null | 目标节点（宿主为el类型时有值） |
| storKeys | array | [] | 存储键 |
| storTmp | object | {} | 缓存键值对 |
| storObs | object | {} | storTmp的proxy对象 |
| rawHtml | string | '' | 目标节点的原始HTML文本 |
| rawOpts | object | {} | 从参数map中取得的原始参数 |
| dftOpts | object | {} | 基于rawOpts合并用户参数的默认参数 |
| options | object | {} | 用户参数 |
| plans | object | {} | 监听事件集合 |
| destroyed | boolean | false | 销毁状态 |
公共方法
本框架的模块基于相同的编写方式，所以有相同的内部方法。
如果options.content获得是异步数据，那么init和update方法可能会返回AsyncFunction，此时需要使用then方法进行下一步操作。
updateCache和save方法在启用options.storName之后才有效，这两个方法一般由模块自动完成，不需要手动操作。
| 方法名 | 返回值 | 说明 |
|---|---|---|
| init([cb]) | this/AsyncFunction(可能) | 初始化实例，回调无参数 |
| destroy([cb]) | this | 销毁实例，回调无参数 |
| reset([cb]) | this | 实例重置，回调无参数 |
| update(settings[,cb]) | this/AsyncFunction(可能) | 更新参数，回调无参数 |
| updateCache(value) | this | 更新缓存，参数为参数键值对（该方法一般不使用） |
| save([cb]) | this | 保存缓存，回调无参数（该方法一般不使用） |
