feat: 更新 formkit 配置,添加 group 类型支持并优化组件结构
This commit is contained in:
@ -6,7 +6,7 @@ import { autoAnimatePlugin } from '@formkit/auto-animate/vue';
|
||||
import type { FormKitOptions } from '@formkit/core';
|
||||
import { register as decodeErrors } from '@formkit/dev';
|
||||
import { createI18nPlugin, zh } from '@formkit/i18n';
|
||||
import { createLibraryPlugin, submit, text } from '@formkit/inputs';
|
||||
import { createLibraryPlugin, group, submit, text } from '@formkit/inputs';
|
||||
import * as defaultRules from '@formkit/rules';
|
||||
import { createValidationPlugin } from '@formkit/validation';
|
||||
import { /* defaultConfig, */ bindings, plugin /* defaultConfig */ } from '@formkit/vue';
|
||||
@ -23,6 +23,7 @@ const config: FormKitOptions = {
|
||||
createLibraryPlugin({
|
||||
text,
|
||||
submit,
|
||||
group,
|
||||
// ==============================
|
||||
form,
|
||||
PInputText,
|
||||
|
@ -77,13 +77,35 @@ async function submit(formData: Record<string, any>, formNode: FormKitNode) {
|
||||
</template> -->
|
||||
</FormKit>
|
||||
|
||||
<!-- <FormKit
|
||||
v-if="false"
|
||||
type="text"
|
||||
label="默认text"
|
||||
validation="required"
|
||||
<Button
|
||||
label="Button"
|
||||
@click="() => {
|
||||
value!.button = value!.button || {};
|
||||
(value!.button as any).clicked = 'clicked';
|
||||
}"
|
||||
/>
|
||||
|
||||
<FormKit
|
||||
type="group"
|
||||
name="group"
|
||||
>
|
||||
</FormKit> -->
|
||||
<FormKit
|
||||
type="text"
|
||||
name="text-in-group-1"
|
||||
>
|
||||
</FormKit>
|
||||
</FormKit>
|
||||
|
||||
<FormKit
|
||||
type="group"
|
||||
name="group"
|
||||
>
|
||||
<FormKit
|
||||
type="text"
|
||||
name="text-in-group-2"
|
||||
>
|
||||
</FormKit>
|
||||
</FormKit>
|
||||
|
||||
<pre class="font-mono text-sm p-4 bg-slate-100 dark:bg-gray-900 overflow-x-auto rounded-md shadow-inner dark:text-gray-300
|
||||
">{{ value }}</pre>
|
||||
@ -92,3 +114,9 @@ async function submit(formData: Record<string, any>, formNode: FormKitNode) {
|
||||
</Fieldset>
|
||||
|
||||
</template>
|
||||
|
||||
<style scoped>
|
||||
:deep(.formkit-input) {
|
||||
border: 1px solid #e2e8f0;
|
||||
}
|
||||
</style>
|
Reference in New Issue
Block a user