Heim > WeChat-Applet > Mini-Programmentwicklung > Das WeChat-Applet verwendet eine modale Komponente, um ein Beispiel für die Freigabe von Dialogfeldern anzuzeigen

Das WeChat-Applet verwendet eine modale Komponente, um ein Beispiel für die Freigabe von Dialogfeldern anzuzeigen

小云云
Freigeben: 2018-01-05 13:40:11
Original
6446 Leute haben es durchsucht

In diesem Artikel wird hauptsächlich die Popup-Dialogfeldfunktion des WeChat-Applets mithilfe der Modalkomponente vorgestellt und die relevanten Attribute und Ereignisreaktionsoperationsfähigkeiten der Modellkomponente des WeChat-Applets anhand von Beispielen analysiert Ich kann darauf verweisen. Ich hoffe, es kann allen helfen.

1. Effektanzeige

2. Schlüsselcode

①, index.wxml

<view>提示:{{tip}}</view>
<button type="default" bindtap="showModal">点击我弹出modal对话框</button>
<view>
 <modal title="modal对话框" hidden="{{modalHidden}}" confirm-text="确定" cancel-text="取消" bindconfirm="modalBindaconfirm" bindcancel="modalBindcancel">您好,我是modal对话框</modal>
</view>
Nach dem Login kopieren

②, index.js

Page({
 data:{
  // text:"这是一个页面"
  tip:&#39;&#39;,
  buttonDisabled:false,
  modalHidden:true,
  show:false
 },
 showModal:function(){
  this.setData({
   modalHidden:!this.data.modalHidden
  })
 },
 modalBindaconfirm:function(){
   this.setData({
   modalHidden:!this.data.modalHidden,
   show:!this.data.show,
   tip:&#39;您点击了【确认】按钮!&#39;,
   buttonDisabled:!this.data.buttonDisabled
  })
 },
 modalBindcancel:function(){
   this.setData({
   modalHidden:!this.data.modalHidden,
   tip:&#39;您点击了【取消】按钮!&#39;
  })
 }
})
Nach dem Login kopieren

Verwandte Empfehlungen:

WeChat Detaillierte Einführung in die modale Komponente des Mini-Programms

So verwenden Sie die modale Komponente von Bootstrap zum Anpassen von Warn-, Bestätigungs- und modalen Dialogfeldern_Javascript-Fähigkeiten

WeChat mini Ausführliche Erklärung der modalen Popup-Komponente des Programms

Das obige ist der detaillierte Inhalt vonDas WeChat-Applet verwendet eine modale Komponente, um ein Beispiel für die Freigabe von Dialogfeldern anzuzeigen. 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