微信小程序四種彈窗方式實(shí)例
更新時(shí)間：2023年06月12日 15:37:21 作者：噠不溜-w
微信小程序彈窗是小程序在需要提示用戶的時(shí)候,顯示的一種交互形式,下面這篇文章主要給大家介紹了關(guān)于微信小程序四種彈窗方式的相關(guān)資料,文中通過(guò)實(shí)例代碼介紹的非常詳細(xì),需要的朋友可以參考下
一、wx.showToast(Object object)
顯示消息提示框
wx.showToast({
title: '內(nèi)容', //提示的內(nèi)容
duration: 2000, //持續(xù)的時(shí)間
icon: 'loading', //圖標(biāo)有success、error、loading、none四種
mask: true //顯示透明蒙層 防止觸摸穿透
})示例：
二 、wx.showModal(Object object)
顯示模態(tài)對(duì)話框
wx.showModal({
title: '我是標(biāo)題', //提示的標(biāo)題
content: '我是內(nèi)容', //提示的內(nèi)容
success: function(res) {
if(res.confirm) {
console.log('用戶點(diǎn)擊了確定')
} else if (res.cancel) {
console.log('用戶點(diǎn)擊了取消')
}
}
})示例：
三、wx.showLoading(Object object)
顯示 loading 提示框。需主動(dòng)調(diào)用 wx.hideLoading 才能關(guān)閉提示框
wx.showLoading({
title: '加載中',
})
setTimeout(function () {
wx.hideLoading()
}, 2000)
示例：
注意：
wx.showLoading 和 wx.showToast 同時(shí)只能顯示一個(gè)wx.showLoading 應(yīng)與 wx.hideLoading 配對(duì)使用
四、wx.showActionSheet(Object object)
顯示操作菜單
wx.showActionSheet({
itemList:['選項(xiàng)一','選項(xiàng)二','其它'], //文字?jǐn)?shù)組
success: (res) => {
switch(res.tapIndex) {
case 0:
console.log('點(diǎn)擊了 選項(xiàng)一')
break;
case 1:
console.log('點(diǎn)擊了 選項(xiàng)二')
break;
case 2:
console.log('點(diǎn)擊了 其它選項(xiàng)')
break;
}
},
fail (res) {
console.log('取消選項(xiàng)')
}
})示例：
五、官方文檔
具體參數(shù)可見官網(wǎng)：微信小程序彈窗
總結(jié)
到此這篇關(guān)于微信小程序四種彈窗方式的文章就介紹到這了,更多相關(guān)微信小程序彈窗方式內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！
相關(guān)文章
這篇文章主要為大家介紹了項(xiàng)目中使用Typescript封裝axios的示例過(guò)程詳解，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪2022-07-07
javascript中sessionStorage的存儲(chǔ)機(jī)制的使用小結(jié)
本文主要介紹了javascript中sessionStorage的存儲(chǔ)機(jī)制的使用,包括其作用域、生命周期、存儲(chǔ)容量、數(shù)據(jù)類型以及API的使用,具有一定的參考價(jià)值,感興趣的可以了解一下2025-05-05
JavaScript通如何過(guò)RGraph實(shí)現(xiàn)動(dòng)態(tài)儀表盤
這篇文章主要介紹了JavaScript通如何過(guò)RGraph實(shí)現(xiàn)動(dòng)態(tài)儀表盤,文中通過(guò)示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友可以參考下2020-10-10
JS Array.from()將偽數(shù)組轉(zhuǎn)換成數(shù)組的方法示例
這篇文章主要介紹了JS Array.from()將偽數(shù)組轉(zhuǎn)換成數(shù)組的方法示例，文中通過(guò)示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2020-03-03
js自己實(shí)現(xiàn)一個(gè)大文件切片上傳+斷點(diǎn)續(xù)傳的示例代碼
本文主要介紹了js自己實(shí)現(xiàn)一個(gè)大文件切片上傳+斷點(diǎn)續(xù)傳的示例代碼，文中通過(guò)示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2022-06-06
這篇文章主要介紹了js比較日期大小的方法,涉及javascript日期的轉(zhuǎn)化、匹配、比較等常用操作技巧,需要的朋友可以參考下2015-05-05
這篇文章主要為大家詳細(xì)介紹了js制作支付倒計(jì)時(shí)頁(yè)面，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2016-10-10 
延遲加載的函數(shù)，第一次調(diào)用后，會(huì)覆蓋原來(lái)的老函數(shù)，以后再次調(diào)用的是新函數(shù)，不會(huì)再進(jìn)行條件的判斷，提升效率
2012-10-10 
JavaScript實(shí)現(xiàn)LRU緩存淘汰算法的詳細(xì)步驟
這篇文章主要介紹了JavaScript實(shí)現(xiàn)LRU緩存淘汰算法,下面是用 JavaScript 實(shí)現(xiàn) LRU（Least RecentlyUsed,最近最少使用）緩存淘汰算法的代碼,并附上詳細(xì)的步驟解釋,需要的朋友可以參考下
2024-12-12