怎么在微信小程序利用modal弹出框实现一个遮罩层组件-创新互联

今天就跟大家聊聊有关怎么在微信小程序利用modal弹出框实现一个遮罩层组件，可能很多人都不太了解，为了让大家更加了解，小编给大家总结了以下内容，希望大家根据这篇文章可以有所收获。

js

Page({
 data: {
  hiddenModal1:true,
  hiddenModal2:true,
  input:null
 },
 showModal1:function(e){
  this.setData({hiddenModal1:false})
 },
 model1confirm:function(e){
  this.setData({ hiddenModal1: true })
  wx.showToast({
   title: '我觉得OK',
  })
 },
 model1cancel:function(e){
  this.setData({ hiddenModal1: true })
  wx.showToast({
   title: '我觉得不行',
  })
 },
 input:function(e){
  this.setData({input:e.detail.value})
 },
 showModal2: function (e) {
  this.setData({ hiddenModal2: false })
 },
 model2confirm: function (e) {
  this.setData({ hiddenModal2: true })
  wx.showToast({
   title: '确定' +this.data.input,
   icon:'none'
  })
 },
 model2cancel: function (e) {
  this.setData({ hiddenModal2: true })
  wx.showToast({
   title: '取消'+this.data.input,
   icon: 'none'
  })
 }
})

wxml

弹出提示modal
弹出带文本框的modal

 modal是真的好用


 

看完上述内容，你们对怎么在微信小程序利用modal弹出框实现一个遮罩层组件有进一步的了解吗？如果还想了解更多知识或者相关内容，请关注创新互联行业资讯频道，感谢大家的支持。