想封裝wx.showToast,做到可以提示不同資訊。
提示成功資訊,失敗資訊,加載中資訊,文字資訊。
代碼如下:
/**
* 文字提示框
* @param {!string} title 标題
* @param {?Function=} cb 提示框消失時的回調函數
* @param {?number=} seconds 提示框持續的時間,機關(秒)
*/
function showTextToast(title, cb, seconds, mask = true) {
showToast({
title: title,
icon: 'none',
mask: mask,
callback: cb,
seconds: seconds
})
}
/**
* 加載提示框
* @param {!string} title 标題
* @param {?Function=} cb 提示框消失時的回調函數
* @param {?number=} seconds 提示框持續的時間,機關(秒)
*/
function showLoadingToast(title, cb, seconds) {
showToast({
title: title,
icon: 'loading',
mask: true,
callback: cb,
seconds: seconds
})
}
/**
* 成功提示框
* @param {!string} title 标題
* @param {?Function=} cb 提示框消失時的回調函數
* @param {?number=} seconds 提示框持續的時間,機關(秒)
*/
function showSuccessToast(title, cb, seconds) {
showToast({
title: title,
icon: 'success',
mask: true,
callback: cb,
seconds: seconds
})
}
/**
* 錯誤提示框
* @param {!string} title 标題
* @param {?Function=} cb 提示框消失時的回調函數
* @param {?number=} seconds 提示框持續的時間,機關(秒)
*/
function showErrorToast(title, cb, seconds) {
showToast({
title: title,
// image: '../../images/base/base-toast-error.png',
icon: 'none',
mask: true,
callback: cb,
seconds: seconds
})
}
/**
* 文字提示框
* @param title 标題
* @param icon 圖示
* @param image 圖檔,會替換圖示
* @param mask 蒙層
* @param callback 提示框消失時的回調函數
* @param seconds 提示框持續的時間,機關(秒)
*/
function showToast({
title: title,
icon: icon,
image: image,
mask: mask,
callback: callback,
seconds: seconds
}) {
if (!title) {
if (callback) {
callback()
}
return;
}
if (!seconds) {
seconds = 1.7;
}
wx.showToast({
title: title,
icon: icon,
image: image,
mask: mask,
duration: seconds * 1000
});
setTimeout(function () {
if (callback) {
callback()
}
}, seconds * 1000);
}
module.exports = {
/**
* 文字提示框
* @param {!string} title 标題
* @param {?Function=} cb 提示框消失時的回調函數
* @param {?number=} seconds 提示框持續的時間,機關(秒)
*/
showTextToast: showTextToast,
/**
* 加載提示框
* @param {!string} title 标題
* @param {?Function=} cb 提示框消失時的回調函數
* @param {?number=} seconds 提示框持續的時間,機關(秒)
*/
showLoadingToast: showLoadingToast,
/**
* 成功提示框
* @param {!string} title 标題
* @param {?Function=} cb 提示框消失時的回調函數
* @param {?number=} seconds 提示框持續的時間,機關(秒)
*/
showSuccessToast: showSuccessToast,
/**
* 錯誤提示框
* @param {!string} title 标題
* @param {?Function=} cb 提示框消失時的回調函數
* @param {?number=} seconds 提示框持續的時間,機關(秒)
*/
showErrorToast: showErrorToast
}
這隻是一個提示框腳本,還需要配合其他功能一起使用才有效果。
記錄代碼的點點滴滴,如果覺得有用,可以拿去直接使用。記得點贊支援!