Alpine extract data to script tag

<div x-data="dropdown">
    <button @click="toggle">Toggle Content</button>
 
    <div x-show="open">
        Content...
    </div>
</div>
 
<script>
    document.addEventListener('alpine:init', () => {
        Alpine.data('dropdown', () => ({
            open: false,
 
            toggle() {
                this.open = ! this.open
            },
        }))
    })
</script>

Source: alpinejs.dev

Similar codes

8 votes146 views3 answers
Bootstrap 4 center image
CSS
0 vote224 views1 answer
Alacritty auto start fish
CSS
0 vote176 views1 answer
Overflow-wrap: anywhere
CSS
14 votes222 views6 answers
Bootstrap image size
CSS Bootstrap
2 votes158 views1 answer
Why do we need hexadecimal number system
CSS
0 vote167 views1 answer
Rotate keyframe animation
CSS
1 vote169 views1 answer
Sideways linear gradient
CSS
11 votes206 views4 answers
Git hard reset to commit
CSS
0 vote160 views1 answer
How to center an overlay button using flex box
CSS
0 vote187 views1 answer
Como diminuir uma imagem em css
CSS