From a2c49cf6002ca3476c54967939077bce3289dbb5 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E4=B8=A5=E6=B5=A9?= Date: Tue, 11 Nov 2025 12:08:10 +0800 Subject: [PATCH] =?UTF-8?q?refactor:=20=E5=88=A0=E9=99=A4=20use-safe-n-for?= =?UTF-8?q?m-auto-imports.tsx=20=E6=96=87=E4=BB=B6?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/utils/use-safe-n-form-auto-imports.tsx | 121 --------------------- 1 file changed, 121 deletions(-) delete mode 100644 src/utils/use-safe-n-form-auto-imports.tsx diff --git a/src/utils/use-safe-n-form-auto-imports.tsx b/src/utils/use-safe-n-form-auto-imports.tsx deleted file mode 100644 index c4803a5..0000000 --- a/src/utils/use-safe-n-form-auto-imports.tsx +++ /dev/null @@ -1,121 +0,0 @@ -/** - * https://www.naiveui.com/zh-CN/os-theme/components/form - * - * FIXME: `NForm` 和 `NFormItem` 的 slots 还没有实现。`NFormItemGi`组件。 - */ - -import { get, set } from 'lodash-es'; -import type { FormInst, FormItemProps, FormProps } from 'naive-ui'; -import { NForm, NFormItem, formItemProps, NInput, formProps } from 'naive-ui'; -import type { Get, Paths } from 'type-fest'; -import type { SlotsType } from 'vue'; -import { Comment } from 'vue'; - -type UseSafeNFormOptions = { - initialFormValue?: FormValue; -}; - -export function useSafeNForm = Record>( - options: UseSafeNFormOptions = {}, -) { - const formInst = ref(null); - const formValue = ref(structuredClone(toRaw(options.initialFormValue)) || ({} as T)); - - // 创建类型安全的 Form 组件 - type SafeNFormProps = FormProps; - - type SafeNFormSlots = SlotsType<{ - default?: { count?: number }; - }>; - - const SafeNForm = defineComponent( - (props, ctx) => { - return () => ( - { - formInst.value = inst as unknown as FormInst; - }} - > - {ctx.slots.default?.({})} - - ); - }, - { - name: 'SafeNForm', - inheritAttrs: true, - props: formProps, - }, - ); - // <<<<< - - // >>>>> 创建类型安全的 FormItem 组件 - type SafeNFormItemProps

& string> = FormItemProps & { - path: P; - }; - - type SafeNFormItemDefaultSlot

& string> = { - value: Get; - setValue: (val: Get) => void; - }; - - const SafeNFormItemImpl = defineComponent< - SafeNFormItemProps & string>, - /* Emits */ [], - /* EE */ never, - SlotsType<{ default: SafeNFormItemDefaultSlot & string> }> - >( - (props, ctx) => { - return () => { - const value = get(formValue.value, props.path); - function setValue(val: typeof value) { - set(formValue.value, props.path, val); - } - - const defaultSlotContent = ctx.slots.default?.({ - value, - setValue, - }); - - // 如果没有提供默认 slot 内容,则渲染一个 NInput 作为默认输入组件 - const renderDefaultNInput = defaultSlotContent?.some((v) => v.type !== Comment) ? null : ( - - ); - - return ( - - {defaultSlotContent} - {renderDefaultNInput} - - ); - }; - }, - { - name: 'SafeNFormItem', - inheritAttrs: false, - props: Object.keys(formItemProps) as unknown as [keyof FormItemProps], - }, - ); - - // Expose a generic constructor so template literals narrow `path`. - type SafeNFormItemComponent = { - new

& string>( - props: SafeNFormItemProps

, - ): { - $props: SafeNFormItemProps

; - $slots: { - default?: (scope: SafeNFormItemDefaultSlot

) => VNode[]; - }; - }; - }; - const SafeNFormItem = SafeNFormItemImpl as SafeNFormItemComponent; - // <<<<< - - return { - formValue, - SafeNForm, - SafeNFormItem, - formInst, - }; -}