uni-app官網提供的兩種顯示方式:
第一種
uni.showToast
/*
title {string} 提示的內容,長度與 icon 取值有關。
icon {string} 圖標
image {string} 自定義圖標的本地路徑
mask {boolean} 遮罩層
duration {number} 持續時間 默認1500
position {string} 顯示位置 'top','center','bottom'
success {function} 成功的回調
fail {function} 失敗的回調
complete {function} 結束的回調
*/
uni.showToast({
title: '標題',
duration: 2000
});
uni.hideToast(); //隱藏提示框
第二種
uni.showModal
/*
title {string} 提示的標題
content {string} 提示的內容
showCancel {boolean} 是否顯示關閉按鈕 true
cancelText {string} 取消按鈕的文字,"取消",最多四個字符
cancelColor {HexColor} 取消按鈕的文字顏色
confirmText {string} 確認按鈕的文字,"取消",最多四個字符
confirmColor {HexColor} 確認按鈕的文字顏色
success {function} 成功的回調
fail {function} 失敗的回調
complete {function} 結束的回調
*/
uni.showModal({
title: '提示',
content: '這是一個模態彈窗',
success: function (res) {
if (res.confirm) {
console.log('用戶點擊確定');
} else if (res.cancel) {
console.log('用戶點擊取消');
}
}
});
官方的插件市場還有一些大神封裝的提示框組件,有興趣的可以參考下。附上鍊接