如何在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 构建自己的实现，这些实现是根据其框架的结构和最佳实践量身定制的，但这不一定是最好的选择。