如何为InertiaJS useForm对象仅单个属性添加类型提示？

当你遇到_method被推断为undefined导致无法赋值的问题时，不需要手动维护完整的泛型类型，以下几种方法可以只针对单个属性修正类型，同时保留其他属性的自动推断：

1. 直接对单个属性做类型断言 #

最简单的方式是在初始值的_method上添加类型断言，明确它的类型范围：

const form = useForm({
  title: '',
  content: '',
  // 断言为HTTP方法或undefined，覆盖自动推断的纯undefined类型
  _method: undefined as 'GET' | 'POST' | 'PUT' | 'PATCH' | 'DELETE' | undefined,
});

// 现在可以正常赋值
form._method = 'PUT';

如果不需要精确限制HTTP方法，也可以简化为：

_method: undefined as string | undefined

2. 结合typeof和交叉类型实现自动推断+单个属性覆盖 #

如果初始值属性较多、后续可能新增属性，可以先通过typeof获取自动推断的类型，再用交叉类型覆盖_method的定义：

// 定义_method的预期类型
type FormMethod = 'GET' | 'POST' | 'PUT' | 'PATCH' | 'DELETE' | undefined;

// 先定义初始值，让TypeScript自动推断其他属性类型
const initialForm = {
  title: '',
  content: '',
  _method: undefined,
};

// 移除原有_method类型，再交叉上自定义的类型
type FinalForm = Omit<typeof initialForm, '_method'> & { _method: FormMethod };

// 传入泛型FinalForm，同时复用初始值
const form = useForm<FinalForm>(initialForm);

// 正常赋值
form._method = 'PATCH';

这种方式的优势是，后续新增属性只需要修改initialForm，类型会自动同步，不用手动更新泛型定义。

3. 封装自定义useForm钩子（长期复用场景） #

如果你的项目中频繁用到带_method的表单，可以封装一个自定义钩子，默认处理_method的类型：

import { useForm as originalUseForm } from '@inertiajs/react';

// 定义_method的合法类型
type FormMethod = 'GET' | 'POST' | 'PUT' | 'PATCH' | 'DELETE';

// 封装钩子，自动为初始值添加_method的类型支持
function useForm<T>(initialValues: T) {
  return originalUseForm<T & { _method?: FormMethod }>(
    initialValues as T & { _method?: FormMethod }
  );
}

// 使用时直接传初始值，无需额外处理类型
const form = useForm({
  title: '',
  content: '',
  _method: undefined,
});

form._method = 'DELETE';

这样每次使用表单时，都不用再单独处理_method的类型问题。

内容的提问来源于stack exchange，提问作者MOHAMMAD RASIM