如何转换类型 { [k: string]: string; }' 到自定义类型

Question

所以我有一个自定义类型

type urlParamsType = {
    drawer: 'true' | undefined,          
    action: 'edit' | 'create' | undefined,     
}

我想在我的组件中使用它：

const MyComponent = () => {
     const { drawer, action}: urlParamsType = useUrlSearchParams();     
}

useUrlSearchParams

返回

{ \[k: string\]: string; }

的类型，但我想将其转换为 urlParamsType。正确的语法是什么

我从上面的代码中得到的错误：

Type '{ [k: string]: string; }' is missing the following properties from type 'urlParamsType': drawer, action

Answer 1

无法保证 URL 参数实际上会返回该类型，因为用户可以手动编辑参数。

如果你不关心这一点，你可以像这样断言类型：

const MyComponent = () => {
     const { drawer, action} = useUrlSearchParams() as urlParamsType;     
}

但是，请注意，如果将参数修改为您不期望的其他值，则下面的代码可能会失败。

如果你希望你的代码真正类型安全，你可以使用JS手动验证数据，如果无效则进行处理。您可以使用像 Zod 这样的库来完成此操作，它与 TypeScript 配合得很好，或者您也可以手动完成此操作（例如使用

typeof

）。