Maison > Applet WeChat > Développement de mini-programmes > Comment une applet WeChat surveille-t-elle le défilement des utilisateurs vers le haut ou vers le bas ?

Comment une applet WeChat surveille-t-elle le défilement des utilisateurs vers le haut ou vers le bas ?

coldplay.xixi
Libérer: 2020-07-22 10:48:30
original
4531 Les gens l'ont consulté

La méthode permettant à l'applet WeChat de surveiller le glissement de l'utilisateur vers le haut ou vers le bas : définissez d'abord le masqué utilisé par les deux modules qui doivent être commutés ; puis définissez deux variables dans les données pour accepter le changement vrai ou faux ; puis utilisez les données data Il est utilisé pour déterminer si le module affiche les variables cachées et collecte enfin les résultats de la surveillance ;

Comment une applet WeChat surveille-t-elle le défilement des utilisateurs vers le haut ou vers le bas ?

Comment surveiller le glissement de l'utilisateur vers le haut ou vers le bas dans l'applet WeChat :

Idée : Surveillez d'abord si le l'utilisateur glisse vers le haut ou vers le bas Toujours en glissant, après avoir écouté les résultats, modifiez les variables dans les données utilisées pour déterminer si le module est affiché ou masqué. Les deux modules qui doivent être commutés sont masqués. Deux variables sont définies dans le. données pour accepter le changement vrai ou faux.

Le code est :

hidden='{{bottom}}'
hidden='{{top}}'
 
data{
//初始化状态 
top:true,
bottom:false,
}
 
//判断浏览器滚动条上下滚动
if (t.scrollTop > a.data.scrollTop || t.scrollTop == wx.getSystemInfoSync().windowHeight) {
console.log('向下滚动');
// 改变显示隐藏的状态
a.setData({
bottom: true,
top: false
})
console.log(a.data.bottom)
} else {
console.log('向上滚动');
a.setData({
 
bottom: false,
top: true
})
console.log(a.data.bottom)
}
Copier après la connexion

Recommandations d'apprentissage associées : Tutoriel de développement de mini-programmes WeChat

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!

Étiquettes associées:
source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal