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 vote267 views1 answer
Initialize toast
CSS
0 vote305 views1 answer
List-style-type flex
CSS
5 votes286 views3 answers
Npm 'cross-env' is not recognized as an internal or external command
CSS
37 votes640 views6 answers
Overflow in css
CSS
1 vote327 views1 answer
Css Safari conditional
CSS
10 votes289 views4 answers
Css align ul li horizontal
CSS
0 vote252 views1 answer
Css flex alle elemente gleiche höhe
CSS
25 votes296 views5 answers
Line spacing css
CSS
1 vote306 views1 answer
Css animate background image
CSS
2 votes314 views2 answers
Image rendering values css
CSS