微信小程序：消息提示框（wx.showToast）和交互提示框（wx.showModal）

最新推荐文章于 2025-11-24 10:50:16 发布

原创最新推荐文章于 2025-11-24 10:50:16 发布 · 8.9k 阅读

25 ·

CC 4.0 BY-SA版权

文章标签：

#小程序

微信小程序专栏收录该内容

16 篇文章

订阅专栏

本文详细介绍了微信小程序中两种提示框的使用方法：消息提示框和交互消息框。消息提示框仅用于显示信息，而交互消息框允许用户通过'确定'和'取消'按钮进行选择。文章提供了代码示例和实现效果，帮助开发者更好地理解和应用。

摘要： 有时需要提示框来提醒我们相应信息，以及交互提示框来让我们是否继续进行操作。

一、消息提示框

（1）参数介绍
消息提示框只有提示作用，不能交互，函数是wx.showToast，下面列出几个主要且常用参数：
在这里插入图片描述

（2）代码

wx.showToast({
  title: '已取消本次操作',
  icon: 'success',
  duration: 2000
})

（3）效果
在这里插入图片描述

二、交互消息框

（1）参数
交互消失框弹出后，不会自动消息，它有两个按钮：“确定”和“取消”。当用户按动后消息框才会消息，函数是wx.showModal，下面列出常用的几个参数：
在这里插入图片描述
这里主要提一下的是：该函数wx.showModal的回调函数success也有两个参数，分别是comfirm和cancel，意思是当用户按“确定”就是comfirm，按“取消”就是cancel。我们一般在回调函数success里根据用户按动哪个键去执行绑定的操作。

（2）代码：

wx.showModal({
  title: '深度杀菌',
  content: '杀菌即将开始：请确保人、动物及植物都已经离开杀菌区域！',
  success (res) {
    if (res.confirm) {
      //确定绑定的操作
    } else if (res.cancel) {
      //取消绑定的操作
    }
  }
})