2016-02-22 16 views
5

Qual è il modo migliore per accedere agli oggetti Document e Window nel quadro ES6/Aurelia? Ho provato ad accedere a window direttamente nel mio codice Aurelia e sembra funzionare, ma è il modo corretto o c'è un modo Aurelia/ES6 per farlo?Come accedere agli oggetti Finestra e Documento in Aurelia?

In particolare, desidero accedere a proprietà come window.localStorage e window.sessionStorage. Sto appena iniziando con Aurelia ed ES6, quindi sono un po 'meno esperto su come farlo anche se mi piacerebbe seguire gli standard.

Qualcosa di simile a quanto segue:

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

Quel codice effettivamente lavorare in Aurelia, ma è quello corretto scrivere in questo modo?

risposta

11

Questo è il modo corretto di farlo in Aurelia quando si lavora con le API Web, quindi stai bene con il codice che hai attualmente.

Tuttavia, quando si lavora con il DOM si può ovviamente utilizzare l'API DOM standard così, ma Aurelia ha uno strato di astrazione Platform (PAL docs) che verrà estratto qualsiasi piattaforma l'applicazione risiede su un API DOM-like.

Per esempio, l'equivalente di document.getElementById sarebbe

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') 
    } 
} 

Purtroppo, PAL non è realmente facendo molto al momento, ma in futuro si prevede di consentire di lavorare con le chiamate API DOM di tutti i giorni anche se la tua applicazione potrebbe non essere in esecuzione in un DOM "normale".

Una cosa molto importante da non dimenticare è che le API Web native DOM & sono davvero potenti e non c'è niente di sbagliato nell'usare le loro implementazioni native. Altri framework tendono a sviluppare la propria implementazione attorno alle API Web, adattate alle strutture e alle best practice dei loro framework, ma non è necessariamente la cosa migliore.

+0

Ho dovuto leggere la risposta due volte per capire che lo stavo effettivamente usando nel modo corretto. Potresti forse riformulare l'inizio della tua frase per essere più esplicito ... Grazie per la risposta :) – ghiscoding

+0

questa è una buona risposta dettagliata –

+0

Questa dovrebbe essere contrassegnata come risposta accettata. Altamente dettagliato e Platform Abstraction Layer è utilizzato internamente nelle dipendenze e nelle funzionalità di Aurelia perché gestisce il rilevamento delle funzionalità e fallback per la maggior parte delle cose nel DOM. Se stai lavorando con solo '' document.getElementById'' o eseguendo query, la dipendenza PAL potrebbe essere eccessiva, ma per qualsiasi cosa relativa all'eventing e alla modifica del DOM usando gli standard in evoluzione e altre funzionalità come Shadow DOM, sicuramente usando Platform Abstraction Layer . –