效果演示
1.Loading加載界面
2.提示框
代碼實(shí)現(xiàn)
1.Loading加載界面----方法1
應(yīng)用場(chǎng)景：顯示loading -> 你要做的事 -> 隱藏loading，緩解用戶焦慮
//顯示加載界面
wx.showLoading({ // 顯示加載中l(wèi)oading效果
title: "加載中",
mask: true //開(kāi)啟蒙版遮罩
});
//你要做的事...
//隱藏加載界面
wx.hideLoading();
2.Loading加載界面----方法2
應(yīng)用場(chǎng)景：?jiǎn)渭冿@示loading界面，自定義延時(shí)時(shí)間，比較雞肋文章來(lái)源：http://www.zghlxwxcb.cn/news/detail-517147.html
//顯示加載界面
wx.showToast({ // 顯示加載中l(wèi)oading效果2秒
title: '加載中',
icon: 'loading',
duration: 2000 //提示的延遲時(shí)間
});
3.提示框
/* icon可接受的值
success ---顯示成功圖標(biāo)
error ---顯示失敗圖標(biāo)
loading ---顯示加載圖標(biāo)
none ---不顯示圖標(biāo)
*/
wx.showToast({
title: '提交成功',
icon: 'success',
duration: 2000 //提示的延遲時(shí)間
});
wx.showToast({
title: '提交失敗',
icon: 'error',
duration: 2000 //提示的延遲時(shí)間
});
贈(zèng)品
按鈕樣式喜歡的可以搬走！??(●’?’●)`文章來(lái)源地址http://www.zghlxwxcb.cn/news/detail-517147.html
/*保存按鈕*/
.baseinfo-button{
display: flex;
color: #ffffff;
justify-content: center;
align-items: center;
flex-direction: row;
margin-top: 80rpx;
border-radius: 50rpx;
width: 80vw !important;
height: 80rpx !important;
font-weight: 400;
background-color: rgb(36, 202, 169);
}
到了這里，關(guān)于微信小程序Loading加載+提示框（微信小程序）的文章就介紹完了。如果您還想了解更多內(nèi)容，請(qǐng)?jiān)谟疑辖撬阉鱐OY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章，希望大家以后多多支持TOY模板網(wǎng)！
![有效解決微信小程序加載視頻[渲染層網(wǎng)絡(luò)層錯(cuò)誤] Failed to load media](https://imgs.yssmx.com/Uploads/2024/02/516149-1.png)
