你可以使用**x-init**指令，在任何元素的初始化阶段做一些操作。
<div x-init="console.log('我正在初始化中...')"></div>上面的示例将在控制台输出”我正在初始化中…“。
在下面另一个示例，**x-init用于获取一些JSON并在处理组件之前将其存储在x-data**中。
<div
x-data="{ posts: [] }"
x-init="posts = await (await fetch('/posts')).json()"
>...</div>如果你希望在某些元素初始化完成后再执行一些操作，可以使用 Alpine 提供的**$nextTick**魔法。
<div x-init="$nextTick(() => { ... })"></div>你可以将**x-init指令添加到x-data** 指令定义的组件内部，也可以单独使用。例如：
<div x-data>
<span x-init="console.log('我在初始化')"></span>
</div>
<span x-init="console.log('我也在初始化')"></span>如果一个组件**x-data指令的属性值中包含init()**行为，这个行为会自动调用。例如：
<div x-data="{
init() {
console.log('我会自动调用')
}
}">
...
</div>使用**Alpine.data()行为定义在外部的实体，也可以包含init()行为。使用这个实体的组件初始化时也会自动调用这个init()**行为。
Alpine.data('dropdown', () => ({
init() {
console.log('我会在每一个下拉组件初始化时自动调用。')
},
}))