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

1 vote333 views1 answer
Hex code for khaki
CSS
2 votes381 views6 answers
Tailwindcss
CSS
38 votes389 views4 answers
Css pointer event
CSS
0 vote379 views1 answer
Alinhar componentes css
CSS
-1 vote423 views1 answer
Change font size on large screen resolution bootstrap
CSS
4 votes347 views2 answers
Border style
CSS
0 vote385 views2 answers
Webpack animate.css
CSS
16 votes348 views4 answers
Arrow right css
CSS
1 vote358 views1 answer
Css animate border bottom left to right
CSS
0 vote348 views1 answer
Truncate long line with dots
CSS