生命周期

AIP 支持元素级别的生命周期，你可以通过 aip-init 和 aip-effect 来监听元素的生命周期事件。

元素初始化事件（aip-init）

AIP 提供了 aip-init 事件来表明元素被初始化完成。

你可以在任何的元素上添加 aip-init 指令，当这个元素开始初始化的时候，就会执行属性的值，例如：

<div aip-init="console.log('init')"></div>

AIP 允许你在状态变更后，触发相应的回调事件，你可以通过指令 aip-effect 或魔法值 $watch 来完成状态监听。

通过使用 aip-effect 指令可以自动追踪依赖的状态值有哪些，并在状态值改变后自动执行属性提供的值，和 $watch 不同的是，它不依赖某一个特定的值，而是自动分析回调函数里面的依赖，参考简单的示例：

<div aip-state="{ name: 'developer' }">
    <span aip-effect="console.log(name)"></span>
</div>

1
2
3

上面的 aip-effect 回调事件会立即执行，并会在 name 变量更改时再次触发执行。

你可以通过魔法值 $watch 来监听一个状态值，当该数据变更时，则会触发注册的回调事件：

<div
    aip-state="{ name: 'developer' }"
    aip-init="$watch('name', value => console.log(value))"
></div>

1
2
3
4

需要注意的是，$watch 注册的回调事件第一次不会立即执行，而是需要等待监听的变量变更后，才会执行，是一个懒执行的过程。