smalljs$molCerca⌘ KDocumentazionePlaygroundConfrontoEcosistemaInformazioniIT
Modello mentaleGetting StartedIntroduzioneModello mentalePer iniziareDa TypeScript a view.treeStruttura del progettoStrumentiEssentialsInstallazioneVisteStato e reattivitàRoutingRenderingTestingDeploymentRisoluzione dei problemiDataRecupero datiSchemi di datiGiper BazaMoreVetrinaDa React, Vue e SvelteRicettarioAdvancedPluginMetadati del moduloOfflineViste fantasmaAboutFAQTeamReleaseAPI$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

Modello mentale

Se arrivi da React o Vue, i primi giorni in $mol li passi a cercare cose che non ci sono: computed, watch, useEffect, onMounted, una fetch dentro un hook del ciclo di vita. Non sono nascoste da qualche parte nell'API; il modello non ha un posto dove metterle. Questa pagina è la versione in cinque minuti di quel modello. Leggila prima di Viste, e tornaci quando un nome familiare non si trova più.

Pull, non push

Nulla viene calcolato finché qualcuno non lo legge. Una vista si renderizza leggendo le sue proprietà; ogni proprietà legge ciò che le serve; la catena delle dipendenze si compone da sola a partire da quelle letture. Non c'è alcuna sottoscrizione da dichiarare né alcun watch da registrare: la lettura è la sottoscrizione.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}Renderizzare Name legge name(), name() legge user(), user() va in rete. Nessuno ha parlato alla vista della richiesta e nessuno ha parlato della vista alla richiesta. Quando user() cambia, si ricalcola tutto ciò che l'ha letto, e nient'altro.

Nessun ciclo di vita

Non c'è mounted, non c'è useEffect, non c'è created. I dati si richiedono leggendo una proprietà, e una vista legge le sue proprietà quando si renderizza. Così l'esempio qui sopra carica l'utente nel momento in cui $my_profile compare sullo schermo, e non prima. Quando la vista esce dallo schermo, nessuno legge più user(), e la cella viene rilasciata insieme alla vista.Questo è tutto ciò che sostituisce il pattern «fetch al mount»: la vista chiede ciò che le serve e il framework decide quando chiederlo. Il caricamento non è agganciato a un evento della pagina; è agganciato all'essere visibile.

Una proprietà è una cella

Un solo metodo con un argomento opzionale è al contempo getter, setter, valore calcolato e stato:1@ $mol_mem2count( next?: number ) {3 return next ?? 04}Chiamato senza argomenti legge, chiamato con un argomento scrive. @ $mol_mem trasforma il metodo in una cella memorizzata nella cache che si ricalcola quando qualcosa che ha letto è cambiato. Un valore calcolato è solo un metodo @ $mol_mem che legge altri metodi. Un watcher non serve: un effetto collaterale appartiene a un evento, e un gestore di evento è un metodo marcato @ $mol_action.1@ $mol_mem2doubled() {3 return this.count() * 24}5 6@ $mol_action7increment() {8 this.count( this.count() + 1 )9}Modifica questa pagina su GitHubÈ stato utile?SìNoPrecedenteIntroduzioneSuccessivoPer iniziareIn questa paginaPull, non pushNessun ciclo di vitaUna proprietà è una cellaCodice sincrono che aspettaTutto è una sovrascritturaCome leggere i sorgentiNomiAvanti
Type to search the documentation.