小程序API之界面交互

(1)wx.showToast 消息提示框

這里要注意一下代碼的注釋,icon目前只支持 "success" 和 "loading",如果想要去除圖標(biāo)的話,設(shè)置 icon:'none';
另外微信小程序官方還給出了一個(gè)屬性 mask ,默認(rèn)為 false,沒(méi)有實(shí)際顯示效果,透明蒙層,防止觸摸穿透

wx.showToast({
  title: '成功',
  icon: 'success' ,//只支持"success"、"loading" ,默認(rèn)success,去除圖標(biāo)用 none
  image:'', //自定義圖標(biāo)的本地路徑,優(yōu)先級(jí)高于 icon
  duration: 1000,
  success: function() {}
})

(2)wx.showModal消息模態(tài)框

wx.showModal({
  title: '標(biāo)題',
  content: '選擇確定或者取消?',
  success (res) {
    if (res.confirm) {
      console.log('點(diǎn)擊了確定')
    } else if (res.cancel) {
      console.log('點(diǎn)擊了取消')
    }
  }
})

success 回調(diào)函數(shù):

success 回調(diào)函數(shù)

注意:
1、Android 6.7.2 以下版本,點(diǎn)擊取消或蒙層時(shí),回調(diào) fail, errMsg 為 "fail cancel";
2、Android 6.7.2 及以上版本 和 iOS 點(diǎn)擊蒙層不會(huì)關(guān)閉模態(tài)彈窗,所以盡量避免使用「取消」分支中實(shí)現(xiàn)業(yè)務(wù)邏輯

(3)wx.showLoading - wx.hideLoading

loading 提示框。需主動(dòng)調(diào)用 wx.hideLoading 才能關(guān)閉提示框;
同樣也包含屬性 mask;
wx.showLoading 和 wx.showToast 同時(shí)只能顯示一個(gè);

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

(4)wx.showActionSheet 操作菜單

wx.showActionSheet({
  itemList: ['選項(xiàng)一', '選項(xiàng)二', '選項(xiàng)三'],
  success (res) {
    console.log(res.tapIndex)
  },
  fail (res) {
    console.log(res.errMsg)
  }
})
  • itemList 為數(shù)組,最大長(zhǎng)度為6;
  • tapIndex 為用戶點(diǎn)擊的序號(hào),順序從上到下,從0開(kāi)始;
  • 與 wx.showModal 模態(tài)框一樣,需要注意回調(diào)fail,詳情查看 第二點(diǎn) 內(nèi)引用的微信官方的部分;

(5)wx.hideToast 隱藏消息提示框

參數(shù)僅包含 success、fail、complete;
目前這段測(cè)試代碼是放在wx.showToast后面進(jìn)行測(cè)試的,可以正常執(zhí)行。

   setTimeout(function(){
      wx.hideToast({
        success () {
          console.log("hideToast")
        },
        fail () {
          console.log("hideToast.fail")
        }
      })
    },2000)
總結(jié)
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時(shí)請(qǐng)結(jié)合常識(shí)與多方信息審慎甄別。
平臺(tái)聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡(jiǎn)書(shū)系信息發(fā)布平臺(tái),僅提供信息存儲(chǔ)服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

  • wx.showToast(Object object)顯示消息提示框wx.showLoading 和 wx.sho...
    荒劍離閱讀 1,534評(píng)論 0 1
  • 微信小程序在無(wú)論在功能、文檔及相關(guān)支持方面,都是優(yōu)于前面幾種微信賬號(hào)類型,它提供了很多原生程序才有的接口,使得我們...
    未央大佬閱讀 2,395評(píng)論 0 12
  • wx.canIUse(string schema) 判斷小程序的API、回調(diào)、參數(shù)、組件等是否在當(dāng)前版本可用 wx...
    魚(yú)兒灬天上飛閱讀 733評(píng)論 0 1
  • 前言 相比H5彈出框的實(shí)現(xiàn)方式要么用插件,要么自己寫(xiě);微信小程序則提供了幾個(gè)彈出框api,使用起來(lái)更簡(jiǎn)單、方便;每...
    FaxMiao閱讀 11,061評(píng)論 0 0
  • 久違的晴天,家長(zhǎng)會(huì)。 家長(zhǎng)大會(huì)開(kāi)好到教室時(shí),離放學(xué)已經(jīng)沒(méi)多少時(shí)間了。班主任說(shuō)已經(jīng)安排了三個(gè)家長(zhǎng)分享經(jīng)驗(yàn)。 放學(xué)鈴聲...
    飄雪兒5閱讀 7,813評(píng)論 16 22

友情鏈接更多精彩內(nèi)容