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

0 vote142 views1 answer
Css diplay grid text truncate
CSS
2 votes147 views1 answer
Background gradient problem
CSS
15 votes133 views2 answers
Span cursor pointer
CSS
53 votes136 views4 answers
On hover css
CSS
22 votes131 views4 answers
Import font css from url
CSS
0 vote131 views1 answer
Get ssl certificate command line
CSS
0 vote196 views1 answer
Html css add Avenir light font
CSS
32 votes136 views5 answers
Css text align right
CSS
0 vote109 views1 answer
Tailwind css strikethrough
CSS
5 votes96 views1 answer
Css custom strikethrough
CSS