Interpretations- und Verwendungsbeispiele von wx.showToast(OBJECT) im WeChat Mini-Programm

高洛峰
Freigeben: 2017-02-24 14:51:47
Original
6162 Leute haben es durchsucht

wx.showToast(OBJECT) ist eine von WeChat bereitgestellte API. Ihre Funktion besteht darin, ein Nachrichtenaufforderungsfeld anzuzeigen.
Das Folgende ist die offizielle Dokumentbeschreibung:

Interpretations- und Verwendungsbeispiele von wx.showToast(OBJECT) im WeChat Mini-Programm

Hinweis: Die Symbole unterstützen nur „Erfolg“ und „Laden“
Obwohl es nur zwei Arten von Symbolen gibt , Es kann in vielen Szenarien verwendet werden, um Erfolg, Misserfolg oder andere Texterklärungen zu beschreiben. Wenn Sie dem Benutzer jedoch eine Wartementalität vermitteln müssen, müssen Sie das Symbol „Laden“ verwenden.

Das Folgende ist der offizielle Beispielcode:

wx.showToast({
  title: '成功',
  icon: 'success',
  duration: 2000
})
Nach dem Login kopieren

Im Folgenden wird gezeigt, wie diese API verwendet wird. Öffnen Sie zunächst das WeChat WEB-Entwicklertool, erstellen Sie ein neues Schnellprojekt und löschen Sie das Unbrauchbare Entfernen Sie den Inhalt auf der Homepage und behalten Sie ihn wie in der Abbildung unten gezeigt.

Interpretations- und Verwendungsbeispiele von wx.showToast(OBJECT) im WeChat Mini-Programm

Fügen Sie zwei weitere Schaltflächen hinzu und fügen Sie ihre jeweiligen Klickereignisse hinzu.


Fügen Sie der Schaltfläche eine Navigatornavigation hinzu, um eine Verknüpfung zur Standardprotokollseite herzustellen.

Wie im WXML-Code der Indexseite unten gezeigt

<navigator url="../logs/logs">
  <button type="primary" bindtap="logbtn"> 登陆 </button>
</navigator>
<view class="br">
 
</view>
<navigator url="../logs/logs">
  <button type="primary" bindtap="morebtn"> 查看更多 </button>
</navigator>
Nach dem Login kopieren

Der js-Code der Indexseite lautet wie folgt:

logbtn: function () {
  wx.showToast({
    title: &#39;登陆成功&#39;,
    icon: &#39;success&#39;,
    duration: 1200
  })
},
morebtn: function () {
  wx.showToast({
    title: &#39;加载中&#39;,
    icon: &#39;loading&#39;,
    duration: 1200
  })
},
Nach dem Login kopieren

Die beiden Schaltflächen sind zu nah, fügen wir in der Mitte ein View-Tag ein, um mehr Platz zwischen den Schaltflächen zu schaffen, wie im folgenden Code gezeigt:

<view class="br">
 
</view>
Nach dem Login kopieren

Die Seite wird im folgenden Stil gerendert:

Interpretations- und Verwendungsbeispiele von wx.showToast(OBJECT) im WeChat Mini-Programm

Das Folgende ist das dynamische Bild, nachdem Sie zum Anmelden geklickt haben:

Interpretations- und Verwendungsbeispiele von wx.showToast(OBJECT) im WeChat Mini-Programm


Das Folgende ist das dynamische Bild, nachdem Sie zum Anzeigen von mehr geklickt haben:

Interpretations- und Verwendungsbeispiele von wx.showToast(OBJECT) im WeChat Mini-Programm

Durch die obige Demonstration kann jeder die Wirkung dieser API und die Szenarien kennen, in denen sie verwendet werden kann. Außerdem wird es für jeden einfacher, die offizielle API direkt aufzurufen wenn nötig, was eine bessere Wirkung hat.

Weitere Artikel zur Interpretation und Verwendung von wx.showToast(OBJECT) im WeChat-Applet finden Sie auf der chinesischen PHP-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
Über uns Haftungsausschluss Sitemap
Chinesische PHP-Website:Online-PHP-Schulung für das Gemeinwohl,Helfen Sie PHP-Lernenden, sich schnell weiterzuentwickeln!