想封装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
}
这只是一个提示框脚本,还需要配合其他功能一起使用才有效果。 记录代码的点点滴滴,如果觉得有用,可以拿去直接使用。记得点赞支持!