javascript - 如何访问 Aurelia 中的 Window 和 Document 对象？

Question

访问 ES6/Aurelia 框架中的 Document 和 Window 对象的最佳方式是什么？我确实尝试在我的 Aurelia 代码中直接访问 window，它似乎确实有效，但这是正确的方法还是有 Aurelia/ES6 的方法？

具体来说，我想访问像 window.localStorage 这样的属性和 window.sessionStorage .我刚开始使用 Aurelia 和 ES6，所以虽然我想遵循标准，但我对如何做这件事有点菜鸟。

类似下面的内容:

constructor() {
    this.user = JSON.parse(window.sessionStorage.user || window.localStorage.user);
}

该代码在 Aurelia 中确实有效，但这样写是否正确？

Answer 1

这是使用 Web API 时在 Aurelia 中执行此操作的正确方法，因此您可以使用当前拥有的代码。

但是，在使用 DOM 时，您当然也可以使用标准 DOM API，但 Aurelia 有一个平台抽象层 (PAL docs)，它将使用类似 DOM 的 API 抽象您的应用程序所在的任何平台。

例如，document.getElementById 的等价物是

import {inject} from 'aurelia-framework'
import {DOM} from 'aurelia-pal'

@inject(DOM)
export class Home {
  constructor(DOM) {
    this.DOM = DOM
  }

  attached() {
    let element = this.DOM.getElementById('someId')
  }
}

遗憾的是，PAL 目前并没有真正发挥多大作用，但计划在未来允许您处理日常 DOM API 调用，即使您的应用程序可能未在“正常”DOM 中运行也是如此。

不要忘记的一件非常重要的事情是，原生 DOM 和 Web API 非常强大，使用它们的原生实现没有任何问题。其他框架倾向于围绕 Web API 构建自己的实现，这些实现是根据其框架的结构和最佳实践量身定制的，但这不一定是最好的。