fix(Modal): prevent attrs inherit

This commit is contained in:
Benjamin Canac
2022-03-10 16:33:40 +01:00
parent da3ed26c2c
commit 850c766fab
2 changed files with 12 additions and 2 deletions

View File

@@ -39,7 +39,7 @@
Toggle modal!
</UButton>
<UModal v-model="isModalOpen">
<UModal v-model="isModalOpen" @submit.prevent="onSubmit">
<div class="sm:flex sm:items-start">
<div class="mx-auto flex-shrink-0 flex items-center justify-center h-12 w-12 rounded-full bg-red-100 sm:mx-0 sm:h-10 sm:w-10">
<UIcon name="heroicons-outline:exclamation" class="h-6 w-6 text-red-600" aria-hidden="true" />
@@ -56,7 +56,7 @@
</div>
</div>
<div class="mt-5 sm:mt-4 sm:flex sm:flex-row-reverse">
<button type="button" class="w-full inline-flex justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-red-600 text-base font-medium text-white hover:bg-red-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-red-500 sm:ml-3 sm:w-auto sm:text-sm" @click="open = false">
<button type="submit" class="w-full inline-flex justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-red-600 text-base font-medium text-white hover:bg-red-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-red-500 sm:ml-3 sm:w-auto sm:text-sm" @click="open = false">
Deactivate
</button>
<button ref="cancelButtonRef" type="button" class="mt-3 w-full inline-flex justify-center rounded-md border u-border-gray-300 shadow-sm px-4 py-2 bg-white text-base font-medium u-text-gray-700 hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500 sm:mt-0 sm:w-auto sm:text-sm" @click="open = false">
@@ -175,6 +175,10 @@
Card:
</div>
<UCard @submit.prevent="onSubmit">
<UButton type="submit" label="Submit" class="ml-auto" />
</UCard>
<UCard body-class="flex">
<div class="flex-1 px-4 py-5 sm:p-6 space-y-3">
<UFormGroup label="Email" name="email" required>
@@ -269,6 +273,11 @@ function onClick () {
console.warn('click')
}
function onSubmit () {
// eslint-disable-next-line no-console
console.warn('submit')
}
const dropdownItems = [
[{
label: 'Edit',

View File

@@ -61,6 +61,7 @@ export default {
TransitionChild,
Card
},
inheritAttrs: false,
props: {
modelValue: {
type: Boolean,