在微信小程序开发常用的两个弹框(showToast和showModal)提示

admin 阅读:71 2024-03-02

在微信小程序开发时会经常使用到弹窗提示,比如说加载失败、没有数据等一些提示用户,就我自己也经常用小程序自带的弹窗提示,wx.showToast(OBJECT)和wx.showModal(OBJECT)。下面来讲解下这两个弹窗的用法,其实文档上写的也很明白!

1、wx.showToast(OBJECT)使用方法,完整代码就如下代码,但是一般都不用写那么全,就基本上用前三个或四个


wx.showToast({
  title: '提示文字',
  icon: 'success', //有三种,success、loading、none,前两个显示图标,none不显示图标
  duration: 2000,
  success: function(res) {
    console.log(res.tapIndex)
  },
  fail: function(res) {
    console.log(res.errMsg)
  },
  complete:function(res) {
    console.log(res.errMsg)
  }
})


showToast主要是提示的作用,我一般都和setTimeout合用,提示成功后进行自动进行一些操作,如下代码的意思是:成功提示1500毫秒后,2000毫秒会自动跳转到pages/index/index页面。


wx.showToast({
  title: '提示文字',
  icon: 'success', //有三种,success、loading、none,前两个显示图标,none不显示图标
  duration: 1500,
  success: function(res) {
   setTimeout(function() {
      wx.navigateTo({   
         url:"/pages/index/index"
      })
   }, 2000);
  },


2、wx.showModal(OBJECT)常用于操作提示,比如删除、取消之类的,一般是确认和取消,但是这文字都是可以变的,


wx.showModal({
  title: '提示',
  content: '这是一个模态弹窗',
  success(res) {
    if (res.confirm) {
      console.log('用户点击确定')
    } else if (res.cancel) {
      console.log('用户点击取消')
    }
  }
})


声明

1、部分文章来源于网络,仅作为参考。
2、如果网站中图片和文字侵犯了您的版权,请联系1943759704@qq.com处理!