0
votes

Comprendre Svelte Tick () Lifecycle

Je suis à mi-chemin de la Svelte Docs et j'ai du mal à comprendre le coque () Lifecycle. Y a-t-il une alternative à son réaction?

Par exemple, ce qu'il fait dans cet exemple dans cet exemple de Tutoriel ? < Pré> xxx


1 commentaires

La réponse de Tan Li Hau est assez claire, mais si vous voulez une compréhension plus facile, regardez ceci - YouTu.be/qrpysk2oz68


3 Réponses :


0
votes

Je ne pense pas. D'après ce que je peux dire, il semble être un moyen de faire la queue une valeur ou de continuer la logique de fonction à utiliser dans le "prochain cycle de rendu". Le modèle de React consiste à collecter toutes les modifications de l'état / de la reproduction du cycle de rendu actuel, de calculer la prochaine sortie rendue et de commettre le changement, de commencer ainsi le prochain cycle de rendu.

Le plus proche que vous obtenez avec réaction est this.setstate avec des composants basés sur la classe, ou le USESTE Crochet pour composants fonctionnels.


0 commentaires

2
votes

Stuff vous écrivez après la coche à Svelte est la même que d'écrire cela dans le deuxième paramètre à SetState (). Le deuxième argument de SetState est une fonction de rappel optionnel qui sera exécutée une fois que le STSTATE est terminé et que le composant est re-rendu.

this.setState(..., () => {
// do x
// do y
})


0 commentaires

4
votes

Lorsque vous mettez à jour votre variable, elle ne reflète pas immédiatement sur le DOM, elle est associée à d'autres modifications et mises à jour du cycle de mise à jour suivant.

Tout comme réagir, si vous faites P>

<script>
  let ref;
  let value;
  const updateText = async (newValue) => {
     value = newValue;
     // NOTE: you can't measure the text input immediately
     // and adjust the height, you wait for the changes to be applied to the DOM
     await tick();
     calculateAndAdjustHeight(ref, value);
   }
</script>

<textarea bind:this={ref} {value} />


0 commentaires