解构 TS 中的对象

Question

我有这个 TS 代码，我想让那部分也被键入：

const { data: { person, car, another } }: any = useContext(MyContext);

这里的问题是 ES lint 说：warning Unexpected any. Specify a different type @typescript-eslint/no-explicit-any

我为人、汽车和另一个创建了 3 个接口，我想在 useContext 之后重用它们。 我的目标是分享人，汽车，另一个

有什么线索吗？

Answer 1

类型注释不能放在解构操作中，:字符已经在那里用作将要析构的属性分配给新名称的一种方式。

const { person: p2 } = { person: "Name" }
p2 === "Name" // true

您可以将any替换为您期望从useContext获得的类型。

const { data: { person, car, another } }: { data: { person: Person, car: Car, another: Another } }
= useContext(MyContext);

但理想情况下，useContext的返回类型应该从传递给它的参数中推断出来，当你创建上下文时，你应该有一行如下：

type ContextType = {data: {person: Person, car: Car, another: Another}}
const MyContext = createContext<ContextType>({/* default value */})

然后使用useContext返回的值将已经具有ContextType，并且无需任何类型注释即可键入解构。