◆ Portail Antalaha

Bibliothèques › Alpine.js

Alpine.bind()

Alpine.bind(...) permet de réutiliser des objets x-bind dans votre application.

Voici un exemple simple. Plutôt que de lier manuellement des attributs avec Alpine :

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

Vous pouvez regrouper ces attributs dans un objet réutilisable et utiliser x-bind pour vous y lier :

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

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

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

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

Traduction française de la documentation officielle d'Alpine.js (licence MIT) – https://alpinejs.dev