smalljs$molSuche⌘ KDokuPlaygroundVergleichÖkosystemÜberDE
Mentales ModellGetting StartedEinführungMentales ModellErste SchritteVon TypeScript zu view.treeProjektstrukturWerkzeugeEssentialsInstallationViewsZustand und ReaktivitätRoutingRenderingTestenDeploymentFehlerbehebungDataDatenabrufDatenschemasGiper BazaMoreSchaufensterVon React, Vue und SvelteKochbuchAdvancedPluginsModul-MetadatenOfflineGhost-AnsichtenAboutFAQTeamReleasesAPI$mol_button_major$mol_button_minor$mol_string$mol_number$mol_text$mol_paragraph$mol_list$mol_row$mol_link$mol_check$mol_switch$mol_select$mol_scroll$mol_page$mol_pick

Mentales Modell

Wenn du von React oder Vue kommst, verbringst du die ersten Tage in $mol damit, nach Dingen zu suchen, die es nicht gibt: computed, watch, useEffect, onMounted, ein fetch in einem Lifecycle-Hook. Sie sind nicht irgendwo in der API versteckt; das Modell hat keinen Platz für sie. Diese Seite ist die Fünf-Minuten-Fassung dieses Modells. Lies sie vor Views und komm zurück, wenn ein vertrauter Name fehlt.

Pull statt Push

Nichts wird berechnet, bevor es jemand liest. Eine View rendert, indem sie ihre Eigenschaften liest; jede Eigenschaft liest, was sie braucht; die Abhängigkeitskette setzt sich aus diesen Lesevorgängen von selbst zusammen. Es gibt kein Abonnement zu deklarieren und kein watch zu registrieren: Das Lesen ist das Abonnement.1$my_profile $mol_view2 sub /3 <= Name $mol_view4 sub / <= name \1namespace $.$$ {2 export class $my_profile extends $.$my_profile {3 @ $mol_mem4 user() {5 return this.$.$mol_fetch.json( 'https://api.example.com/me' ) as { name: string }6 }7 name() {8 return this.user().name9 }10 }11}Name zu rendern liest name(), name() liest user(), user() geht ins Netz. Niemand hat der View von der Anfrage erzählt und niemand der Anfrage von der View. Ändert sich user(), berechnet sich alles neu, was es gelesen hat — und sonst nichts.

Kein Lebenszyklus

Es gibt kein mounted, kein useEffect, kein created. Daten werden angefordert, indem eine Eigenschaft gelesen wird, und eine View liest ihre Eigenschaften, wenn sie rendert. Das Beispiel oben lädt den Benutzer also genau in dem Moment, in dem $my_profile auf dem Bildschirm erscheint, und keinen Augenblick früher. Verlässt die View den Bildschirm, liest niemand mehr user(), und die Zelle wird zusammen mit der View freigegeben.Das ist der komplette Ersatz für das Muster „fetch on mount": Die View fragt nach dem, was sie braucht, und das Framework entscheidet, wann gefragt wird. Das Laden hängt nicht an einem Seitenereignis, sondern daran, sichtbar zu sein.

Eine Eigenschaft ist eine Zelle

Eine einzige Methode mit einem optionalen Argument ist zugleich Getter, Setter, berechneter Wert und Zustand:1@ $mol_mem2count( next?: number ) {3 return next ?? 04}Ohne Argument aufgerufen liest sie, mit einem Argument schreibt sie. @ $mol_mem macht aus der Methode eine zwischengespeicherte Zelle, die neu rechnet, wenn sich etwas geändert hat, das sie gelesen hat. Ein berechneter Wert ist einfach eine @ $mol_mem-Methode, die andere Methoden liest. Einen Watcher braucht es nicht: Ein Seiteneffekt gehört zu einem Ereignis, und ein Ereignis-Handler ist eine mit @ $mol_action markierte Methode.1@ $mol_mem2doubled() {3 return this.count() * 24}5 6@ $mol_action7increment() {8 this.count( this.count() + 1 )9}Diese Seite auf GitHub bearbeitenWar das hilfreich?JaNeinZurückEinführungWeiterErste SchritteAuf dieser SeitePull statt PushKein LebenszyklusEine Eigenschaft ist eine ZelleSynchroner Code, der wartetAlles ist eine ÜberschreibungWie man die Quellen liestNamenWeiter
Type to search the documentation.