typescript 是否有更好的方法来访问Supabase生成的TS类型?

pkbketx9  于 2023-06-24  发布在  TypeScript
关注(0)|答案(1)|浏览(136)

我在我的超级数据库中创建了一个名为customer的表。使用生成我的类型

npx supabase gen types typescript --project-id "$PROJECT_REF" --schema public > types/supabase.ts

在我的React应用程序中,这就是我引用生成的类型的方式。

const [customerDetails, setCustomerDetails] = useState<Database["public"]["Tables"]["customer"]["Row"]>()

能不能再干净一点,像这样?

const [customerDetails, setCustomerDetails] = useState<customer>()
rta7y2nd

rta7y2nd1#

你可以用这样的东西
https://github.com/FroggyPanda/better-supabase-types
对supabase生成的类型进行后处理。这将生成一个新的模式文件,其内容如下所示

export type Account = Database['public']['Tables']['accounts']['Row'];
export type InsertAccount = Database['public']['Tables']['accounts']['Insert'];
export type UpdateAccount = Database['public']['Tables']['accounts']['Update'];

如果你不想要另一个依赖项或编写自己的后处理器脚本,你也可以使用一些helper类型来改进类型,如下所示:

export type Row<T extends keyof Database['public']['Tables']> = Database['public']['Tables'][T]['Row'];
export type InsertDto<T extends keyof Database['public']['Tables']> = Database['public']['Tables'][T]['Insert'];
export type UpdateDto<T extends keyof Database['public']['Tables']> = Database['public']['Tables'][T]['Update'];

这将导致

import { InsertDto, Row, UpdateDto } from '@src/interfaces/database';

export type Location = Row<'location'>;
export type LocationInsertDto = InsertDto<'location'>;
export type LocationUpdateDto = UpdateDto<'location'>;

相关问题