Heim > WeChat-Applet > Mini-Programmentwicklung > Implementierung der WeChat-Applet-Überwachungsgeste zum Verschieben von Seiten

Implementierung der WeChat-Applet-Überwachungsgeste zum Verschieben von Seiten

不言
Freigeben: 2018-06-23 15:04:44
Original
5388 Leute haben es durchsucht

In diesem Artikel werden hauptsächlich relevante Informationen zur detaillierten Erläuterung der Beispiele für das Umschalten der WeChat-Applet-Überwachungsgeste vorgestellt. Freunde in Not können sich auf

Die detaillierte Erläuterung des WeChat-Applet-Überwachungsgesten-Schiebens beziehen Beispiele zum Wechseln der Seite

1. Schreiben Sie die Überwachung von Gestenstart, Folie und Ende in die entsprechende XML:

<view class="touch" bindtouchstart="touchStart" bindtouchmove="touchMove" bindtouchend="touchEnd" ></view>
Nach dem Login kopieren

2.js:

var touchDot = 0;//触摸时的原点 
var time = 0;// 时间记录,用于滑动时且时间小于1s则执行左右滑动 
var interval = "";// 记录/清理时间记录 
Page({ 
 data: {...} 
   })
Nach dem Login kopieren

Page({ 
 data: { 
     ... 
 }, 
 // 触摸开始事件 
 touchStart: function (e) { 
  touchDot = e.touches[0].pageX; // 获取触摸时的原点 
  // 使用js计时器记录时间  
  interval = setInterval(function () { 
   time++; 
  }, 100); 
 }, 
 // 触摸移动事件 
 touchMove: function (e) { 
  var touchMove = e.touches[0].pageX; 
  console.log("touchMove:" + touchMove + " touchDot:" + touchDot + " diff:" + (touchMove - touchDot)); 
  // 向左滑动  
  if (touchMove - touchDot <= -40 && time < 10) { 
   wx.switchTab({ 
    url: &#39;../左滑页面/左滑页面&#39; 
   });  
  } 
  // 向右滑动 
  if (touchMove - touchDot >= 40 && time < 10) { 
   console.log(&#39;向右滑动&#39;); 
   wx.switchTab({ 
    url: &#39;../右滑页面/右滑页面&#39; 
   });  
  } 
 }, 
 // 触摸结束事件 
 touchEnd: function (e) { 
  clearInterval(interval); // 清除setInterval 
  time = 0; 
 }, 
. 
. 
. 
})
Nach dem Login kopieren

Das Obige ist das Ich hoffe, dass der gesamte Inhalt dieses Artikels für Sie nützlich ist. Weitere verwandte Inhalte finden Sie auf der chinesischen PHP-Website!

Verwandte Empfehlungen:

WeChat-Miniprogramm Beispiel für eine Scroll-Ansicht, die Pull-Up-Laden und Pull-Down-Aktualisierung implementiert

WeChat-Applet Code zur Anpassung des Popup-Fensters

WeChat-Applet-Entwicklung mit WeChat-Applet

Das obige ist der detaillierte Inhalt vonImplementierung der WeChat-Applet-Überwachungsgeste zum Verschieben von Seiten. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage