Comme mentionné précédemment, le framework d'applet WeChat est une méthode de conception qui analyse la couche logique et la couche d'interface utilisateur. Cette méthode de conception doit résoudre deux problèmes
La couche d'interface utilisateur répond aux changements dans la logique. et les données de la couche logique. 🎜>événement
Ensuite, résolvez le deuxième problème
Qu'est-ce qu'un événementLes événements sont la méthode de communication de la couche de vue à la couche logique. Les événements peuvent renvoyer le comportement de l'utilisateur à la couche logique pour traitement.
Les événements peuvent être liés aux composants. Lorsque l'événement déclencheur est atteint, la fonction de traitement d'événement correspondante dans la couche logique sera exécutée.Les objets événement peuvent contenir des informations supplémentaires, telles que l'identifiant, l'ensemble de données, les touches.de la balisePour résumer, un événement fait référence à quelque chose qui se passe, généralement l'utilisateur effectue une opération, comme cliquer sur un bouton ou faire glisser un doigt sur l'écran du téléphone. Lorsqu'un événement se produit, le framework appelle la fonction de gestion des événements (le cas échéant) afin qu'elle puisse répondre aux opérations de l'utilisateur.
tap
Liaison d'événement
utilise la liaison d'événement pour compléter la réponse aux opérations de l'utilisateur. Par exemple, pour gérer l'événement
, ajoutez , puis ajoutez la fonction
dans .jsl'objet événement contient des données sur l'événement : view
target : le composant qui a déclenché l'événement bindtap = 'tapName'
tapName
//wxml <view id="tapTest" data-hi="WeChat" bindtap="tapName"> Click me! </view> //.js Page({ tapName: function(event) { console.log(event) } })
timeStamp : horodatage (le nombre de millisecondes écoulées à partir du moment où le la page a été ouverte lorsque l'événement a été déclenché)
touches : un tableau contenant des points de contact (multi-touch)
changedTouches : un tableau de points de contact modifiés (multi-touch) -touch)
détail : Informations personnalisées supplémentaires
Événements de bulle et événements sans bulle
Pourquoi y a-t-il cible
et currentTarget La différence est que les événements sont divisés en deux catégories,
événements bouillonnants : quand un composant Une fois l'événement déclenché, l'événement sera transmis au nœud parent. Événement sans bulle : lorsqu'un événement sur un composant est déclenché, l'événement ne sera pas transmis au nœud parent. L'événement tap
est un événement bouillonnant (c'est pourquoi leevent| Type|Condition de déclenchement|dans l'exemple ci-dessus contient
), et Autre les événements bouillonnants incluent
currentTarget
| ------------- |-------------|| L'action tactile commence | | touchmove | Le doigt bouge après avoir touché | | L'action tactile est interrompue, comme le rappel d'appel entrant, la fenêtre contextuelle | l'action tactile se termine || appuyez sur | Quittez immédiatement après avoir touché le doigt|| appuyez longuement | Quittez après plus de 350 ms après avoir touché le doigt|
Pourquoi avez-vous besoin d'un événement bouillonnant ?
Avec un événement bouillonnant, vous pouvez implémenter certaines fonctions plus facilement.
Par exemple, le programme a une vue qui contient l'avatar et le nom de l'utilisateur. Lorsque l'utilisateur clique sur l'avatar ou le nom, la page de détails de l'utilisateur est accédée. S'il n'y a pas d'événement bouillonnant, vous devez gérer les événements de clic de l'avatar et du nom. Il vous suffit désormais d'envelopper un composant dans la couche externe et de gérer l'événement du composant.
Empêcher le bouillonnement d'événement
catchtap
. , vous pouvez empêcher le comportement bouillonnant des événements. Vous pouvez utiliser l'exemple de code suivant pour approfondir votre compréhension des événements bouillonnants.Essayez de modifier la méthode de liaison des événements Tap des nœuds à tous les niveaux pour voir quels changements se produiront dans le journaux de sortie.
Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!