feat: 更新 guests.vue,添加对 FormKitNode 的引用,调整 v-auto-animate 持续时间,修复移除按钮的点击事件
All checks were successful
/ surge (push) Successful in 25s

This commit is contained in:
严浩
2024-11-20 17:08:23 +08:00
parent 998cb5d4e3
commit 064f5d28d0

View File

@ -1,9 +1,21 @@
<script setup lang="ts"> <script setup lang="ts">
import { FormKitNode } from '@formkit/core';
import { FormKitMessages } from '@formkit/vue' import { FormKitMessages } from '@formkit/vue'
import { onMounted, ref } from 'vue';
const listRef = ref<{ node: FormKitNode }>()
onMounted(() => {
const listNode = listRef.value?.node
console.debug(`listNode :>> `, listNode);
setTimeout(() => {
listNode;
}, 1000);
})
</script> </script>
<template> <template>
<FormKit <FormKit
ref="listRef"
type="list" type="list"
name="guests" name="guests"
label="客人列表" label="客人列表"
@ -14,7 +26,7 @@ import { FormKitMessages } from '@formkit/vue'
> >
<div <div
class="attributes-group" class="attributes-group"
v-auto-animate v-auto-animate="{ duration: 500 }"
> >
<FormKitMessages /> <FormKitMessages />
<FormKit <FormKit
@ -41,7 +53,7 @@ import { FormKitMessages } from '@formkit/vue'
<button <button
type="button" type="button"
class="border border-blue-600 text-blue-600 p-3" class="border border-blue-600 text-blue-600 p-3"
@click="() => node.input(value?.filter((_, i) => i !== index))" @click="() => node.remove(node.children[index])"
> >
- 移除 - 移除
</button> </button>