微信小程序api视频课程-界面-交互-wx.showToast 消息提示框的使用

刺骨的言语ヽ痛彻心扉 2024-02-19 19:19 40阅读 0赞

效果图  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3UwMTM4MTgyMDU_size_16_color_FFFFFF_t_70]  
微信小程序交流群：111733917 | 微信小程序从0基础到就业的课程：[https://edu.csdn.net/topic/huangjuhua][https_edu.csdn.net_topic_huangjuhua]

### wxml代码 ###

wx.showToast(Object object)
    显示消息提示框
    
    <button bindtap="ts01">消息提示框01</button>
    
    <button bindtap="ts02">消息提示框02</button>
    
    <button bindtap="ts03">消息提示框03</button>
    
    <button bindtap="ts04">消息提示框04</button>

### js代码 ###

/**
       * 页面的初始数据
       */
      data: {
    
      },
      ts01:function(){
        wx.showToast({
          title: '提示01',
          icon:"success",
          duration:3000
        })
      },
      ts02: function () {
        wx.showToast({
          title: '提示02',
          icon: "loading",
          duration: 2000
        })
      },
      ts03: function () {
        wx.showToast({
          title: '提示03',
          icon: "none",
          duration: 2000
        })
      },
      ts04: function () {
        wx.showToast({
          title: '提示04',
          image:"/images/b-on.png",
          duration: 2000
        })
      },

[欢迎大家收看我的视频教程：微信小程序常用API使用][API]

![界面-交互-wx.showToast][-_-wx.showToast]

[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3UwMTM4MTgyMDU_size_16_color_FFFFFF_t_70]: https://image.dandelioncloud.cn/pgy_files/images/2024/01/29/9ea5ff6e81114b60964ccc4822b06515.png
[https_edu.csdn.net_topic_huangjuhua]: https://edu.csdn.net/topic/huangjuhua
[API]: https://ke.qq.com/course/383235?tuin=2b10d56
[-_-wx.showToast]: https://image.dandelioncloud.cn/pgy_files/images/2024/01/29/b07b6d6d81bc4bf0800779cde97a3172.png