从 .tsx 文件访问 Window 对象

Question

通常在我的 .ts 文件中，我可以通过调用以下内容来访问 window 对象：

(<any>window).myObject

我的 .tsx 文件中出现编译错误。有什么方法可以从 .tsx 文件访问它吗？

谢谢。

Answer 1

您可以使用 as 语法进行类型断言。这是类型断言的替代语法，因为 <type>obj 与 JSX 语法冲突：

(window as any).myObject

上面的方法可以工作，但是如果你想要强类型，请考虑 augmenting Window 接口来添加你的属性这样你就可以进行编译时类型检查：

declare global {
    interface Window {
        myObject: YourObjectType;
    }
}

Answer 2

语法 <type> 已被 ts 团队弃用。这是因为它与新的 jsx 语法之间存在太多歧义。相反，ts 团队为类型断言引入了 as 运算符。

所以这个语法：

(window as any).things

最新更新。

进行此更改是因为基本上很难告诉编译器这种语法何时与类型或 jsx 元素相关。同样，符号变得更难阅读（例如，见下文）：

<Component>
  {<String>something}
</Component>

可以在此处找到更多详细信息https://basarat.gitbooks.io/typescript/docs/types/type-assertion.html#as-foo-vs-foo and here https://github.com/Microsoft/TypeScript/issues/296

Answer 3

关于@Saravana 回答的进一步解释，

最好的方法是在您的 types 文件夹中定义它，并添加一个扩展名为 .d.ts 的定义文件，即：window.d.ts 并将您的扩展定义放在 window 对象，因为打字稿全局扩充通常提供合并接口。

declare global {
    interface Window {
        myObject: YourObjectType;
    }
}

// but make sure to export that as default so Typescript with consider it automatically on the project
export default global;

从 .tsx 文件访问 Window 对象

Accessing Window Object from .tsx file

javascript

window-object

typescript