typescript - 类型中缺少属性但在不同类型中需要？

Question

仍在尝试将我的头绕在打字稿上。

我正在尝试像这样键入一个解构对象：

const { authError }: {authError: string} = useRouterQuery()

authError 必须是一个字符串才能很好地与其他组件一起使用，但useRouterQuery()使用的是不同的类型：ParsedUrlQuery.

所以我收到以下打字稿错误：Property 'authError' is missing in type 'ParsedUrlQuery' but required in type '{ authError: string; }'.

希望有人可以为此解释最干净的解决方案。

编辑：ParsedUrlQuery类型返回：

type ParsedUrlQuery = {
    [x: string]: string | string[] | undefined;
}

标签： typescript

Answer 1

您可以做一件事 - 它是 typeguard：

type ParsedUrlQuery = {
    [x: string]: string | string[] | undefined;
}

/**
 * Just a mock
 */
const useRouterQuery = () => ({}) as ParsedUrlQuery

const isAuthorError = (arg: any): arg is { authError: NonNullable<ParsedUrlQuery[string]> } => typeof arg?.authError === 'string'

const result = useRouterQuery()

if (isAuthorError(result)) {
    /**
     * Now you can be sure that authError is either string or string[]
     */
    const { authError } = result
}


const { authError }: ParsedUrlQuery = useRouterQuery()

TS 编译器没有其他方法可以确定是否authError存在。

在这里您可以找到有关类型保护的更多信息