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 vote326 views1 answer
How to some of the list and show some in css
CSS
0 vote323 views1 answer
Css add margin to a particular div in print screen
CSS
0 vote314 views1 answer
Css add space right
CSS
0 vote337 views1 answer
Which of the following css property is used to specify the space between every letter inside an element?
CSS
0 vote347 views1 answer
How to slide div from left to right using css
CSS
1 vote339 views2 answers
Css animation linear
CSS
0 vote339 views1 answer
How to make a flex container full page
CSS
1 vote335 views1 answer
Centering items in react css
CSS
12 votes346 views4 answers
Hover on one div affect another
CSS
2 votes265 views1 answer
Xpath vs css selector
CSS