feat: 添加自动动画插件,更新 FormKit 配置以支持动态列表,重构样式和组件结构
All checks were successful
/ surge (push) Successful in 31s
All checks were successful
/ surge (push) Successful in 31s
This commit is contained in:
22
src/App.vue
22
src/App.vue
@ -51,7 +51,7 @@ const SCHEMA: FormKitSchemaDefinition = [
|
||||
label: 'JSON Schema’ed Input',
|
||||
name: 'input',
|
||||
validation: 'required',
|
||||
validationLabel: 'input字段',
|
||||
validationLabel: 'validationLabel', // validation message 使用顺序:validationLabel > label > name
|
||||
errors: ['显式设置的错误是非阻塞的,这意味着它们不会像验证错误那样阻止表单提交。您可以在表单文档中了解更多有关错误处理的信息。']
|
||||
}
|
||||
]
|
||||
@ -69,6 +69,7 @@ const SCHEMA: FormKitSchemaDefinition = [
|
||||
submit-label="提交 ✨"
|
||||
>
|
||||
<div class="character-attributes">
|
||||
|
||||
<FormKit
|
||||
type="group"
|
||||
name="attributes"
|
||||
@ -146,6 +147,7 @@ const SCHEMA: FormKitSchemaDefinition = [
|
||||
<div class="character-attributes">
|
||||
<FormKitSchema :schema="SCHEMA" />
|
||||
</div>
|
||||
|
||||
<Guests />
|
||||
|
||||
<FormKit
|
||||
@ -162,14 +164,6 @@ const SCHEMA: FormKitSchemaDefinition = [
|
||||
</template>
|
||||
|
||||
<style scoped>
|
||||
.character-attributes {
|
||||
padding: 1.5rem;
|
||||
border: 1px solid #e5e7eb;
|
||||
border-radius: 0.5rem;
|
||||
margin-bottom: 1rem;
|
||||
background-color: #f9fafb;
|
||||
}
|
||||
|
||||
ul.error-box {
|
||||
padding: 0.75rem;
|
||||
border: 1px solid #ef4444;
|
||||
@ -183,4 +177,14 @@ ul.error-box {
|
||||
ul.error-box p {
|
||||
font-weight: 500;
|
||||
}
|
||||
</style>
|
||||
|
||||
<style>
|
||||
.character-attributes {
|
||||
padding: 1.5rem;
|
||||
border: 1px solid #e5e7eb;
|
||||
border-radius: 0.5rem;
|
||||
margin-bottom: 1rem;
|
||||
background-color: #f9fafb;
|
||||
}
|
||||
</style>
|
Reference in New Issue
Block a user