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

22 votes266 views4 answers
Css center in grid
CSS
0 vote303 views1 answer
Prevent enter key submitting a form jquery
CSS
0 vote284 views2 answers
Caching
CSS
0 vote262 views1 answer
Align links to right css
CSS
1 vote261 views1 answer
Css prevent margin collapsing
CSS
0 vote271 views1 answer
Body{text-align: center;}
CSS
1 vote257 views1 answer
Add alpha value to css color variable
CSS
0 vote321 views1 answer
Farther of genetics
CSS
3 votes254 views3 answers
Uigradients
CSS
17 votes311 views2 answers
Linking css
CSS