30 lines
782 B
Vue
30 lines
782 B
Vue
<script setup>
|
|
import { ref, watch } from 'vue';
|
|
|
|
defineProps({
|
|
type: {
|
|
type: String,
|
|
default: 'submit',
|
|
},
|
|
bgcolor: {
|
|
type: String,
|
|
default: 'bg-blue-500'
|
|
},
|
|
});
|
|
|
|
const isHover = ref(false);
|
|
|
|
watch(
|
|
() => isHover.value,
|
|
(isHover) => {
|
|
console.log(isHover)
|
|
}
|
|
)
|
|
|
|
</script>
|
|
|
|
<template>
|
|
<button :type="type" class="inline-flex items-center px-4 py-2 bg-blue-500 border border-transparent rounded-md font-semibold text-xs text-white uppercase tracking-widest hover:bg-blue-700 focus:bg-blue-700 active:bg-blue-900 focus:outline-none focus:ring-2 focus:ring-indigo-500 focus:ring-offset-2 disabled:opacity-50 transition ease-in-out duration-150" :class="[bgcolor, color]">
|
|
<slot />
|
|
</button>
|
|
</template> |