跳转至

Alpine.bind

Alpine.bind(...) 提供了一种在你的应用中复用 x-bind 对象的方式。

以下是一个简单示例。相较于使用 Alpine 手动绑定属性:

<button type="button" @click="doSomething()" :disabled="shouldDisable"></button>

你可以将这些属性打包成一个可复用的对象,并使用 x-bind 来绑定它:

<button x-bind="SomeButton"></button>

<script>
    document.addEventListener('alpine:init', () => {
        Alpine.bind('SomeButton', () => ({
            type: 'button',

            '@click'() {
                this.doSomething()
            },

            ':disabled'() {
                return this.shouldDisable
            },
        }))
    })
</script>