javascript - typescript + jQuery : correct way to use event state?

标签 javascript jquery typescript1.4

我有一些简单的 SPA 的 popstate 代码,如下所示:

module myModule {
    $(function () {
        $(window).on("popstate", function(e) {
            if (e.originalEvent.state !== null) {
                // code removed
            }
        });
    });
}

(使用originalEvent是因为这样的答案:popstate returns event.state is undefined)

这会产生编译错误:

Property 'state' does not exist on type 'Event'.

e 是 JQueryEventObject 类型,originalEvent 是 Event 类型。

现在我已经通过定义此接口(interface)成功解决了该问题:

interface EventWithState extends Event {
    state: any;
}

(*我怀疑“任何”真的是我最好的选择 - 如果有人知道应该让我知道什么类型的状态,更重要的是在这种情况下我如何自己找到它)

我改变了上面的代码,如下所示:

module myModule {
    $(function () {
        $(window).on("popstate", function(e) {
            if ((<EventWithState>e.originalEvent).state !== null) {
                // code removed
            }
        });
    });
}

好的,现在工作正常并编译为我想要的原始代码。但这似乎是一个尴尬的解决方法。

这是可以接受的方法吗? typescript 定义中是否缺少某些内容?或者我缺少什么。

此外,使用e.state也不起作用,但是编辑jquery.d.ts(来自DefinitelyTyped)并将state:any;添加到BaseJQueryEventObject可以修复它与我的解决方法类似。这让我觉得有关事件状态的 typescript 定义中缺少一些东西。

最佳答案

感谢 Pilot 分享了另一个问题的答案,虽然一开始似乎无关,但它确实为我提供了线索和链接,让我弄清楚我可以转换到 PopStateEvent 而不是我自己的 EventWithState。

module myModule {
    $(function () {
        $(window).on("popstate", function(e) {
            if ((<PopStateEvent>e.originalEvent).state !== null) {
                // code removed
            }
        });
    });
}

https://developer.mozilla.org/en-US/docs/Web/API/Event

https://developer.mozilla.org/en-US/docs/Web/API/PopStateEvent

根据记录,lib.d.ts 确实使用“any”作为状态类型:

interface PopStateEvent extends Event {
    state: any;
    initPopStateEvent(typeArg: string, canBubbleArg: boolean, cancelableArg: boolean, stateArg: any): void;
}

https://typescript.codeplex.com/SourceControl/latest#bin/lib.d.ts

关于javascript - typescript + jQuery : correct way to use event state?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/31421099/

相关文章:

javascript - 如何在 Flask 中根据数据库 (PostgreSQL/SQLAlchemy) 的不同列创建 JSON 文件,以便在 JavaScript 代码中使用它?

javascript - html5 SessionStorage 在 android 模拟器中不起作用

javascript - Backbone.js fetch() JSON 到模型 get() 返回未定义

javascript - 错误在条件表达式中不必要地使用 bool 文字 no-unneeded-ternary

javascript - 一旦 div 离开屏幕,将其隐藏并使用户保持在页面上的相同位置

javascript - 如何初始化 - 使用 TypeScript 的 AngularJs 应用程序

javascript - 在 div 中隐藏旧内容

javascript - 当 centerMode 为 true 且 infinite 为 false 时,Slick.js 删除第一张和最后一张幻灯片上的间隙

typescript1.4 - 为什么我不能在联合上执行 instanceof?

typescript - 为什么长度应该是索引器的子类型?