微信小程序进阶

常见的交互反馈设计

Toast和模态对话框

在完成某个操作成功之后，我们希望告诉用户这次操作成功并且不打断用户接下来的操作。弹出式提示Toast就是用在这样的场景上，Toast提示默认1.5秒后自动消失

写法

Page({
  onLoad: function() {
    wx.showToast({
      title: '已发送',   弹窗的内容最多7个字

      icon: 'success',  icon图标

      duration: 1500   显示的时间 1500=1.5秒

  })

    // wx.hideToast()    隐藏Toast

  }

})

模态框

Page({
  onLoad: function() {
    wx.showModal({
      title: '标题',  标题

      content: '告知当前状态，信息和解决方法',      标题下面的内容

      confirmText: '主操作',

      cancelText: '次要操作',

      success: function(res) {
        if (res.confirm) {    点击了确认之后的操作

          console.log('用户点击主操作')

        } else if (res.cancel) {   点击了取消之后的操作

   console.log('用户点击次要操作')