溫馨提示×

溫馨提示×

您好,登錄后才能下訂單哦!

密碼登錄×
登錄注冊×
其他方式登錄
點擊 登錄注冊 即表示同意《億速云用戶服務條款》

微信小程序開發(fā)中如何顯示消息提示框

發(fā)布時間:2022-01-20 14:06:06 來源:億速云 閱讀:1385 作者:清風 欄目:開發(fā)技術(shù)

本文將為大家詳細介紹“微信小程序開發(fā)中如何顯示消息提示框”,內(nèi)容步驟清晰詳細,細節(jié)處理妥當,而小編每天都會更新不同的知識點,希望這篇“微信小程序開發(fā)中如何顯示消息提示框”能夠給你意想不到的收獲,請大家跟著小編的思路慢慢深入,具體內(nèi)容如下,一起去收獲新知識吧。

wx.showToast(OBJECT)


顯示消息提示框。

OBJECT參數(shù)說明:

參數(shù) 類型 必填 說明 最低版本
title String 提示的內(nèi)容  
icon String 圖標,有效值"success"、"loading"  
image String 自定義圖標的本地路徑,image 的優(yōu)先級高于 icon 1.1.0
duration Number 提示的延遲時間,單位毫秒,默認:1500  
mask Boolean 是否顯示透明蒙層,防止觸摸穿透,默認:false  
success Function 接口調(diào)用成功的回調(diào)函數(shù)  
fail Function 接口調(diào)用失敗的回調(diào)函數(shù)  
complete Function 接口調(diào)用結(jié)束的回調(diào)函數(shù)(調(diào)用成功、失敗都會執(zhí)行)  

示例代碼:

wx.showToast({
  title: '成功',
  icon: 'success',
  duration: 2000})

wx.showLoading(OBJECT)


基礎庫版本 1.1.0 開始支持,低版本需做兼容處理

顯示 loading 提示框, 需主動調(diào)用 wx.hideLoading 才能關閉提示框

OBJECT參數(shù)說明:

參數(shù) 類型 必填 說明
title String 提示的內(nèi)容
mask Boolean 是否顯示透明蒙層,防止觸摸穿透,默認:false
success Function 接口調(diào)用成功的回調(diào)函數(shù)
fail Function 接口調(diào)用失敗的回調(diào)函數(shù)
complete Function 接口調(diào)用結(jié)束的回調(diào)函數(shù)(調(diào)用成功、失敗都會執(zhí)行)

wx.hideToast()


隱藏消息提示框

wx.hideLoading()


基礎庫版本 1.1.0 開始支持,低版本需做兼容處理

隱藏loading提示框

wx.showLoading({
  title: '加載中',
})

setTimeout(function(){
  wx.hideLoading()
},2000)

wx.showModal(OBJECT)


顯示模態(tài)彈窗

OBJECT參數(shù)說明:

參數(shù) 類型 必填 說明
title String 提示的標題
content String 提示的內(nèi)容
showCancel Boolean 是否顯示取消按鈕,默認為 true
cancelText String 取消按鈕的文字,默認為"取消",最多 4 個字符
cancelColor HexColor 取消按鈕的文字顏色,默認為"#000000"
confirmText String 確定按鈕的文字,默認為"確定",最多 4 個字符
confirmColor HexColor 確定按鈕的文字顏色,默認為"#3CC51F"
success Function 接口調(diào)用成功的回調(diào)函數(shù)
fail Function 接口調(diào)用失敗的回調(diào)函數(shù)
complete Function 接口調(diào)用結(jié)束的回調(diào)函數(shù)(調(diào)用成功、失敗都會執(zhí)行)

succes返回參數(shù)說明:

參數(shù) 類型 說明 最低版本
confirm Boolean 為 true 時,表示用戶點擊了確定按鈕  
cancel Boolean 為 true 時,表示用戶點擊了取消(用于 Android 系統(tǒng)區(qū)分點擊蒙層關閉還是點擊取消按鈕關閉)1.1.0

示例代碼:

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

wx.showActionSheet(OBJECT)


顯示操作菜單

OBJECT參數(shù)說明:

參數(shù) 類型 必填 說明
itemList String Array 按鈕的文字數(shù)組,數(shù)組長度最大為6個
itemColor HexColor 按鈕的文字顏色,默認為"#000000"
success Function 接口調(diào)用成功的回調(diào)函數(shù),詳見返回參數(shù)說明
fail Function 接口調(diào)用失敗的回調(diào)函數(shù)
complete Function 接口調(diào)用結(jié)束的回調(diào)函數(shù)(調(diào)用成功、失敗都會執(zhí)行)

success返回參數(shù)說明:

參數(shù) 類型 說明
tapIndex Number 用戶點擊的按鈕,從上到下的順序,從0開始

示例代碼:

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

Bug & Tip

  1. bug:Android6.3.30,wx.showModal 的返回的 confirm 一直為 true;

  2. tip: wx.showActionSheet 點擊取消或蒙層時,回調(diào)fail, errMsg 為 "showActionSheet:fail cancel";

  3. tip: wx.showLoading 和 wx.showToast 同時只能顯示一個,使用 wx.hideToast/wx.hideLoading 都可以關閉提示框;

  4. tip: iOS wx.showModal 點擊蒙層不會關閉模態(tài)彈窗,所以盡量避免使用“取消”分支中實現(xiàn)業(yè)務邏輯。

小程序是什么意思

小程序是一種不需要下載安裝即可使用的應用,通過掃描二維碼或是搜一搜立即使用,操作簡單,便于傳播,能夠?qū)崿F(xiàn)消息通知、線下掃碼、公眾號關聯(lián)等七大功能。它基于微信運行的,類似于APP,想用就用,用完即走,不會占用內(nèi)存。

感謝您能讀到這里,小編希望您對“微信小程序開發(fā)中如何顯示消息提示框”這一關鍵問題有了從實踐層面最深刻的體會,具體使用情況還需要大家自己動手實踐使用過才能領會,如果想閱讀更多相關內(nèi)容的文章,歡迎關注億速云行業(yè)資訊頻道!

向AI問一下細節(jié)

免責聲明:本站發(fā)布的內(nèi)容(圖片、視頻和文字)以原創(chuàng)、轉(zhuǎn)載和分享為主,文章觀點不代表本網(wǎng)站立場,如果涉及侵權(quán)請聯(lián)系站長郵箱:is@yisu.com進行舉報,并提供相關證據(jù),一經(jīng)查實,將立刻刪除涉嫌侵權(quán)內(nèi)容。

AI