微信小程式與用戶交互

一.顯示消息提示框

wx.showToast({屬性名:屬性值})

自定義一個提示框,時間到了會自動關閉

wx.showToast({

    title:"成功",  //必填

    icon: 'success',//圖標只支持"success"、"loading" 

    image: '/images/tan.png',//自定義圖標的本地路徑，image 的優先順序高於 icon

    duration: 2000,//提示的延遲時間，單位毫秒，預設：1500 

    mask: false,//是否顯示透明蒙層，防止觸摸穿透，預設：false 

    success:function(){}, //介面調用成功的回調函數

    fail:function(){}, //介面調用失敗的回調函數

    complete:function(){} //介面調用結束的回調函數（調用成功、失敗都會執行）

})

wx.showLoading({屬性名:屬性值})

顯示Loading提示框,不會自動關閉,需主動調用 wx.hideLoading 才能關閉提示框

wx.showLoading({
  title: '載入中',
})
setTimeout(function () {
  wx.hideLoading()
}, 2000)

wx.hideLoading({屬性名:屬性值})

隱藏 loading 提示框

二.類似html中confirm

wx.showModal({屬性名:屬性值})

wx.showModal({
  title: '提示',
  content: '這是一個模態彈窗',
  success (res) {
    if (res.confirm) {
      console.log('用戶點擊確定')
    } else if (res.cancel) {
      console.log('用戶點擊取消')
    }
  }
})

object.success 回調函數

Object res

三.顯示操作菜單

wx.showActionSheet({屬性名:屬性值})

wx.showActionSheet({
  itemList: ['A', 'B', 'C'],
  success (res) {
    console.log(res.tapIndex)
  },
  fail (res) {
    console.log(res.errMsg)
  }
})

object.success 回調函數

參數

Object res

註意

• Android 6.7.2 以下版本，點擊取消或蒙層時，回調 fail, errMsg 為 "fail cancel"；
• Android 6.7.2 及以上版本 和 iOS 點擊蒙層不會關閉模態彈窗，所以儘量避免使用「取消」分支中實現業務邏輯