开启掘金成长之旅！这是我参与「掘金日新计划 · 12 月更文挑战」的第11天，点击查看活动详情
AXML
数据绑定
AXML 中的动态数据与对应的 Page 中 data 内容绑定
数据绑定使用 [Mustache] 语法将变量用两对大括号 {{}} 封装，可在多种语法场景下使用
组件属性
组件属性使用双引号“”封装
控制属性
控制属性需使用双引号 "" 封装
关键字
关键字需使用双引号封装 ""。
- true：Boolean 类型的 true，代表真值。
- false：Boolean 类型的 false，代表假值
注意: 不要直接写 checked="false"，计算结果是一个字符串，转成布尔值类型后代表真值。
运算
可用两对大括号 {{}} 封装简单的运算。支持如下几种方式：
三元运算
算术运算
页面输出：
逻辑判断
字符串运算
数据路径运算
组合
- 数组
- 对象
最终组合成的对象是 {foo: 1, bar: 2}。
也可用解构运算符 ... 来将一个对象展开：
最终组合成的对象是 {a: 1, b: 2, c: 3, d: 4, e: 5}。
最终组合成的对象是 {foo: 'my-foo', bar:'my-bar'}。
注意： 上面的方式可以随意组合，但是变量名相同时，后边的变量会覆盖前面的变量，例如：
最终组合成的对象是{a:5,b:3,c:6}
Q：跳转页面时，如何清除 data 数据中的数据？
A：无法清除，可以在跳转时覆盖之前的 data 值。
条件渲染
a:if在框架中使用a:if=“{{condition}}”来判断是否需要渲染该代码块。
也可以使用 a:elif 和 a:else 添加一个 else 块。
block a:if
因为
a:if 是控制属性，需要在标签中使用。如果要一次性判断多个组件标签，可以使用 <block/> 标签包装多个组件，并使用 a:if 来控制属性。(可以把多个组件标签包在一起）
说明：<block/> 并不是一个组件，只是一个包装元素，不会在页面中做任何渲染，只接受控制属性。
对比 a:if 与 hidden
a:if中的模板可能包含数据绑定，所以当a:if的条件值切换时，框架有局部渲染的过程，用于确保条件块在切换时销毁或重新渲染。此外，a:if在初始渲染条件为 false 时，不触发任何渲染动作，当条件第一次变成 true 时才开始局部渲染。hidden控制显示与隐藏，组件始终会被渲染。 一般来说，a:if有更高的切换消耗而hidden有更高的初始渲染消耗。因此，在需要频繁切换的情景下，用hidden更好。如果在运行时条件改变不多则a:if较好。
列表渲染
a:for:在组件上使用 a:for 属性可以绑定一个数组，即可使用数组中各项的数据重复渲染该组件。
数组当前项的下标变量名默认为 index，数组当前项的变量名默认为 item。
使用a:for-item可以指定数组当前元素的变量名。使用a:for-index可以指定数组当前下标的变量名
a:for 支持嵌套。 以下是九九乘法表的嵌套示例代码。
block a:for
与 block a:if 类似，可以将 a:for 用在 <block/> 标签上，以渲染一个包含多节点的结构块。
a:key
如果列表项位置会动态改变或者有新项目添加到列表中，同时希望列表项保持特征和状态（例如 <input/> 中的输入内容，<switch/> 的选中状态），需要使用 a:key 来指定列表项的唯一标识。
a:key 的值以两种形式来提供：
- 字符串：代表列表项某个属性，属性值需要是列表中唯一的字符串或数字，例如 ID，并且不能动态改变。
- 保留关键字
*this，代表列表项本身，并且它是唯一的字符串或者数字，例如当数据改变触发重新渲染时，会校正带有key的组件，框架会确保数据重新被排序，而不是重新创建，这可以使组件保持自身状态，提高列表渲染效率。
注意： - 如不提供
a:key，则会提示 warning。 - 如果明确知道列表是静态，或者不用关注其顺序，则可以忽略。 下面是示例代码：
key
key 是比 a:key 更通用的写法，里面可以填充任意表达式和字符串。
注意： key 不能设置在 block 上。
模板（封装一个模块功能）
AXML 提供模板 template，可以在模板中定义代码片段，然后在不同地方调用。 建议使用 template 方式引入模板片段，因为 template 会指定其作用域，只使用 data 传入的数据，如果 template 的 data 没有改变，该片段 UI 不会重新渲染。
使用 name 属性申明模板名，然后在 <template /> 内定义代码片段。
使用模板
使用 is 属性，声明需要的模板，然后将需要的 data 传入，例如：
is 属性可以使用 Mustache 语法，来动态决定具体渲染哪个模板。
示例代码：
模板作用域
模板有其作用域，只能使用 data 传入的数据。除了直接由 data 传入数据外，也可以通过 onXX 事件绑定页面逻辑进行函数处理。如下代码所示：
在其他页面调用是先通过import引入文件，放在顶层
引用
AXML 提供两种文件引用方式 import 和 include。
import
import 可以加载已经定义好的 template。
例如，在 item.axml 中定义了一个叫 item 的 template
import 有作用域的概念，只会 import 目标文件中定义的 template，而不会 import 目标文件 import 的 template。
例如，C import B，B import A，在 C 中可以使用 B 定义的 template，在 B 中可以使用 A 定义的 template，但是 C 不能使用 A 中定义的 template。
include
include 可以将目标文件除 <template/> 外整个代码引入，相当于是拷贝到 include位置
引入路径
模板引入路径支持相对路径、绝对路径，也支持从 node_modules 目录载入第三方模块。
