【微信小程序开发】常用方法封装工具类utils.js

一、背景

开发小程序时会普遍使用到的方法特别适合用来封装一个工具类，现在把我经常用到的一些方法分享出来，也希望大家一起来集思广益，完善这个工具类

二、代码

//模态框
function showModal(title, content, confirm, cancel) {
    uni.showModal({
        title: title,
        content: content,
        showCancel: true,
        success(res) {
            if (res.confirm) {
                confirm(confirm)
            } else if (res.cancel) {
                if (cancel) {
                    cancel(cancel)
                }
            }
        },
    })
}
//提示框
function showToast(title, icon, duration, success) {
    uni.showToast({
        title: title,
        icon: icon,
        duration: duration ? duration : 2000,
        mask: true,
        success: function (res) {
            if (success) {
                success(res)
            }
        },
        fail: function () { },
    })
}
//加载框
function showLoading(title) {
    if (title) {
        uni.showLoading({
            title: title,
            mask: true,
            success: () => { },
            fail: () => {
                uni.hideLoading()
            }
        })
    } else {
        uni.showLoading({
            title: '加载中...',
            mask: true,
            success: () => { },
            fail: () => {
                uni.hideLoading()
            }
        })
    }
}
//手机号脱敏
function formatterPhone(value) {
    var len = value.length;
    var xx = value.substring(3, len - 4);
    var values = value.replace(xx, "****");
    return values;
}
//身份证脱敏
function formatterIDCard(value) {
    var len = value.length;
    var xx = value.substring(5, len - 4);
    var values = value.replace(xx, "**********");
    return values;
}
//节流
function throttle(fn, interval) {
    var enterTime = 0; //触发的时间
    var gapTime = interval || 2000; //间隔时间，如果interval不传，则默认2000ms
    return function () {
        var context = this;
        var backTime = new Date(); //第一次函数return即触发的时间
        if (backTime - enterTime > gapTime) {
            fn.call(context, arguments);
            enterTime = backTime; //赋值给第一次触发的时间，这样就保存了第二次触发的时间
        }
    };
}
//防抖
function debounce(fn, interval) {
    var timer;
    var gapTime = interval || 2000; //间隔时间，如果interval不传，则默认2000ms
    return function () {
        clearTimeout(timer);
        var context = this;
        var args = arguments; //保存此处的arguments，因为setTimeout是全局的，arguments不是防抖函数需要的。
        timer = setTimeout(function () {
            fn.call(context, args);
        }, gapTime);
    };
}
//格式化时间 返回2024/03/02 14:23:32这种格式
function formatTime(date) {
    const year = date.getFullYear()
    const month = date.getMonth() + 1
    const day = date.getDate()
    const hour = date.getHours()
    const minute = date.getMinutes()
    const second = date.getSeconds()
    return `${[year, month, day].map(formatNumber).join('/')} ${[hour, minute, second].map(formatNumber).join(':')}`
}
function formatNumber(n) {
    n = n.toString()
    return n[1] ? n : `0${n}`
}
//字符串转数字,默认两位
function string2Number(str) {
    return Number.parseInt(str).toFixed(2);
}
//请求封装
function requestUrl(url, data, method) {
    let promise = new Promise((resolve, reject) => {
        uni.request({
            url: url,
            data: data,
            method: method,
            header: {
                'token': wx.getStorageSync('token')
            },
            success: res => {
                resolve(res.data);
            },
            fail: res => {
                reject(res.data);
            },
        })
    })
    return promise
}
module.exports = {
    throttle,
    debounce: debounce,
    showModal,
    showToast,
    showLoading,
    requestUrl,
    string2Number,
    formatTime,
    formatterPhone,
    formatterIDCard
};