Add pop-up dialog box in WeChat applet

This time I will bring you the precautions for adding a pop-up dialog box in the WeChat applet. What are the precautions? The following is a practical case. Let’s take a look. take a look.

Key code

①、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:'您点击了【取消】按钮！'
  })
 }
})

I believe you have mastered the method after reading the case in this article. For more exciting information, please pay attention to other related articles on the php Chinese website!

Recommended reading:

How to achieve interlaced color change in js

How to implement dynamic cascade loading of easyui's drop-down box ( Code attached)

The above is the detailed content of Add pop-up dialog box in WeChat applet. For more information, please follow other related articles on the PHP Chinese website!