Comment utiliser le composant modal pour afficher une boîte de dialogue dans l'applet WeChat

Cet article présente principalement la fonction de dialogue contextuelle de l'applet WeChat à l'aide du composant modal, et analyse les propriétés pertinentes et les compétences opérationnelles de réponse aux événements du composant modèle de l'applet WeChat sous forme d'exemples. référez-vous à lui

Cet article décrit l'exemple de l'applet WeChat utilisant le composant modal pour faire apparaître la fonction de boîte de dialogue. Partagez-le avec tout le monde pour votre référence, comme suit :

Code clé

①, 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>

②, index.js

Page({
 data:{
  // text:"这是一个页面"
  tip:'',
  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:'您点击了【确认】按钮！',
   buttonDisabled:!this.data.buttonDisabled
  })
 },
 modalBindcancel:function(){
   this.setData({
   modalHidden:!this.data.modalHidden,
   tip:'您点击了【取消】按钮！'
  })
 }
})

Ce qui précède est ce que j'ai compilé pour vous. J'espère qu'il vous sera utile à l'avenir.

Articles connexes :

Utiliser Electron pour créer des applications de bureau React+Webpack (tutoriel détaillé)

Comment l'implémenter dans WeChat mini programme Balayez vers la gauche ou la droite

Quels sont les types de données spéciaux en JavaScript

Comment utiliser Ajax pour demander des données de serveur dans l'applet WeChat

Comment utiliser le réseau de requêtes pour effectuer des opérations de requête dans les 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!