modal-buma
v1.0.1
Published
## Usage Component
Downloads
3
Readme
modal-buma
Usage Component
npm i modal-buma
In Main.js
import Modal from 'modal-buma'
import '../node_modules/modal-buma/dist/style.css'
const app = createApp(App)
app.use(Modal)
app.mount('#app')
Test Component
<script setup>
import { ref } from "vue";
const showPopup = ref(false);
const togglePopup = () => {
showPopup.value = !showPopup.value;
};
const handleClose = async (value) => {
showPopup.value = value;
};
const handleClick = async () => {
console.log("click");
};
</script>
<template>
<div>
<button
@click="togglePopup"
class="bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded"
>
Open Popup
</button>
<Modal :title="'title'" :size="'medium'" :message="'Message'" :showPopup="showPopup" @closePopUp="handleClose()" @clickButton="handleClick()" />
</div>
</template>