呕心沥血 封装20个微信小程序常用方法到utils.js

以下是将20个微信小程序常用方法封装到utils.js中并暴露给外部使用的示例代码

// utils.js

// 1. 获取当前页面路径
function getCurrentPageUrl() {
  const pages = getCurrentPages();
  const currentPage = pages[pages.length - 1];
  const url = `/${currentPage.route}`;
  return url;
}

// 2. 获取当前页面参数
function getCurrentPageOptions() {
  const pages = getCurrentPages();
  const currentPage = pages[pages.length - 1];
  const options = currentPage.options;
  return options;
}

// 3. 显示成功提示框
function showSuccessToast(msg) {
  wx.showToast({
    title: msg,
    icon: 'success',
    duration: 1500
  });
}

// 4. 显示失败提示框
function showErrorToast(msg) {
  wx.showToast({
    title: msg,
    icon: 'none',
    duration: 1500
  });
}

// 5. 显示模态弹窗
function showModal(title, content, confirmText = '确定', cancelText = '取消') {
  return new Promise((resolve, reject) => {
    wx.showModal({
      title: title,
      content: content,
      confirmText: confirmText,
      cancelText: cancelText,
      success(res) {
        if (res.confirm) {
          resolve(true);
        } else if (res.cancel) {
          resolve(false);
        }
      },
      fail(err) {
        reject(err);
      }
    });
  });
}

// 6. 获取元素信息
function getElementInfo(selector, context = null) {
  return new Promise((resolve, reject) => {
    const query = context ? wx.createSelectorQuery().in(context) : wx.createSelectorQuery();
    query.select(selector).boundingClientRect(res => {
      if (res) {
        resolve(res);
      } else {
        reject(new Error(`找不到元素:${selector}`));
      }
    }).exec();
  });
}

// 7. 节流函数
function throttle(fn, interval = 300) {
  let timer = null;
  return function (...args) {
    if (!timer) {
      timer = setTimeout(() => {
        fn.apply(this, args);
        timer = null;
      }, interval);
    }
  };
}

// 8. 防抖函数
function debounce(fn, delay = 500) {
  let timer = null;
  return function (...args) {
    clearTimeout(timer);
    timer = setTimeout(() => {
      fn.apply(this, args);
    }, delay);
  };
}

// 9. 获取系统信息
function getSystemInfo() {
  return new Promise((resolve, reject) => {
    wx.getSystemInfo({
      success(res) {
        resolve(res);
      },
      fail(err) {
        reject(err);
      }
    });
  });
}

// 10. 获取网络状态
function getNetworkType() {
  return new Promise((resolve, reject) => {
    wx.getNetworkType({
      success(res) {
        resolve(res.networkType);
      },
      fail(err) {
        reject(err);
      }
    });
  });
}

// 11. 设置导航栏标题
function setNavigationBarTitle(title) {
  return new Promise((resolve, reject) => {
    wx.setNavigationBarTitle({
      title: title,
      success() {
        resolve();
      },
      fail(err) {
        reject(err);
      }
    });
  });
}

// 12. 设置导航栏颜色
function setNavigationBarColor(frontColor, backgroundColor) {
  return new Promise((resolve, reject) => {
    wx.setNavigationBarColor({
      frontColor: frontColor,
      backgroundColor: backgroundColor,
      success() {
        resolve();
      },
      fail(err) {
        reject(err);
      }
    });
  });
}

// 13. 获取用户授权
function getSetting() {
  return new Promise((resolve, reject) => {
    wx.getSetting({
      success(res) {
        resolve(res.authSetting);
      },
      fail(err) {
        reject(err);
      }
    });
  });
}

// 14. 打开设置页面
function openSetting() {
  return new Promise((resolve, reject) => {
    wx.openSetting({
      success(res) {
        resolve(res.authSetting);
      },
      fail(err) {
        reject(err);
      }
    });
  });
}

// 15. 获取用户信息
function getUserInfo(withCredentials = false) {
  return new Promise((resolve, reject) => {
    wx.getUserInfo({
      withCredentials: withCredentials,
      success(res) {
        resolve(res.userInfo);
      },

  • 1
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

前端鼓励师

老铁 支持一波

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值