x-effect

x-effect 是一个有用的指令，用于在其依赖项之一发生变化时重新求值表达式。你可以把它看作是一个观察者（watcher），你不需要指定要观察哪个属性，它会观察其中使用的所有属性。

如果这个定义让你感到困惑，没关系。通过一个示例来解释会更清楚：

<div x-data="{ label: 'Hello' }" x-effect="console.log(label)">
    <button @click="label += ' World!'">Change Message</button>
</div>

当这个组件加载时，x-effect 表达式会被执行，并在控制台中输出 "Hello"。

由于 Alpine 知道 x-effect 中包含的所有属性引用，当按钮被点击且 label 发生变化时，effect 会重新触发，并在控制台中输出 "Hello World!"。