Observateurs
L'observateur (Watcher) est une fonctionnalité de ofa.js utilisée pour surveiller les changements de données et exécuter une logique correspondante. Lorsque les données réactives changent, l'observateur déclenche automatiquement une fonction de rappel, vous permettant d'effectuer des tâches telles que la transformation de données, des opérations à effet secondaire ou un traitement asynchrone.
Utilisation de base
Les observateurs sont définis dans l'objet watch du composant, où les noms de clé correspondent aux noms des propriétés de données à observer, et les valeurs sont les fonctions de rappel exécutées lorsque les données changent.
count:{{count}}
doubleCount:{{doubleCount}}
Paramètres de la fonction de rappel
La fonction de rappel du listener reçoit deux paramètres :- newValue：la nouvelle valeur après le changement
{watchers}：l’ensemble des objets observateurs du composant actuel
Après les changements de données, un traitement anti-rebond est d'abord effectué, puis le callback dans watch est exécuté ; le paramètre watchers est l'ensemble de toutes les modifications fusionnées pendant ce cycle anti-rebond.
Les fonctions dans watch sont appelées immédiatement après l'initialisation du composant, afin d'établir l'écoute des données. On peut distinguer s'il s'agit du premier appel en vérifiant si watchers possède une longueur.
Nom : {{name}}
Âge : {{age}}
{{log}}
Écoute approfondie
Pour les données imbriquées de type objet ou tableau, une écoute profonde est automatiquement effectuée dans watch.
Informations utilisateur:
Nom: {{user.name}}
Âge: {{user.age}}
Loisirs: {{user.hobbies.join(', ')}}
Écouter plusieurs sources de données
Vous pouvez surveiller les changements de plusieurs données en même temps et exécuter la logique correspondante en fonction des changements des multiples données dans la fonction de rappel.
Largeur : {{rectWidth}}
Hauteur : {{rectHeight}}
Surface : {{area}}
Scénarios d'application réels
1. Validation des formulaires
{{usernameError}}
{{emailError}}
2. Définir le thème
Paramètre: {{settings.theme}}
État de sauvegarde: {{saveStatus}}
Remarques
- Évitez de modifier les données surveillées : modifier les données surveillées dans le rappel du « watcher » peut entraîner une boucle infinie. Si une modification est nécessaire, assurez-vous d’avoir une condition appropriée.
- Préférez une propriété calculée : si vous devez calculer une nouvelle valeur à partir de plusieurs données, il est recommandé d’utiliser une propriété calculée plutôt qu’un « watcher ».