其他分享
首页 > 其他分享> > showModal、showToast弹窗封装使用

showModal、showToast弹窗封装使用

作者:互联网

话不多说,直接上代码

/**
     * 显示提示框
     * @param {String} content 需要提示的文字
     * @param {String} title  标题
     * @param {String} showCancel 是否显示取消键
     * @param {String} confirmText 确定按钮文案
     * @param {function} callback 回调函数
     * @return null
     */
showModal({ title = "", content = "确认此操作吗?",showCancel = false,confirmText="确定" } = {}, successCallback){
        return wx.showModal({
            title: title,
            content: content,
            showCancel:showCancel,
            confirmText:confirmText,
            success: res => {
                if (res.confirm) {
                      successCallback()
                } else if (res.cancel) {
                      console.log('用户点击取消')
                }
              }
        });
    },

写了个构造,把常用所需要的属性配置一下返回,根据点击的确认与否调用回调函数,
同理showToast

/**
     * 显示提示框
     * @param {String} msg 需要提示的文字
     * @param {function} callback 回调函数
     * @param {function} duration 显示时长
     * @return null
     */
    toast(msg, callback, duration = 1500) {
        wx.showToast({
            title: msg,
            icon: 'none',
            duration: duration,
            success(res) {
                if (callback) {
                    setTimeout(callback, 1500);
                }
            }
        })
    },

此两个api在uniapp中使用基本一致,多端兼容项目也可参考

标签:String,title,res,param,callback,showModal,duration,弹窗,showToast
来源: https://blog.csdn.net/qq_45659769/article/details/120697270