更新记录

1.0.0(2026-02-04) 下载此版本

常用功能和 uni-app API 封装的工具库,旨在提高开发效率。


平台兼容性

uni-app(3.6.16)

Vue2 Vue3 Chrome Safari app-vue app-nvue Android iOS 鸿蒙
微信小程序 支付宝小程序 抖音小程序 百度小程序 快手小程序 京东小程序 鸿蒙元服务 QQ小程序 飞书小程序 小红书小程序 快应用-华为 快应用-联盟

其他

多语言 暗黑模式 宽屏模式
× ×

通用工具库使用文档 (common/utils.js)

common/utils.js 是一个集成了常用功能和 uni-app API 封装的工具库,旨在提高开发效率。

📦 引入方式

1. 局部引入(推荐)

import utils from '@/common/utils.js';

utils.toast('Hello');

2. 全局挂载

main.js 中挂载:

import utils from '@/common/utils.js';
// Vue 3
app.config.globalProperties.$utils = utils;
uni.$utils = utils;

使用时:

this.$utils.toast('Hello'); // Options API
uni.$utils.toast('Hello');  // 任意位置

🛠️ API 列表

1. 时间/日期处理 (Date)

方法名 参数 描述 示例
formatDate (time, format) 格式化时间 utils.formatDate(Date.now(), 'YYYY-MM-DD')
getRelativeTime (time) 获取相对时间 utils.getRelativeTime(Date.now() - 60000) // "1分钟前"
getDayOfWeek (date, prefix) 获取星期几 utils.getDayOfWeek(new Date()) // "周三"
addToDate (date, amount, unit) 时间加减 utils.addToDate(new Date(), 1, 'day')
getStartOfDay (date) 获取当天开始时间 utils.getStartOfDay(new Date())
getEndOfDay (date) 获取当天结束时间 utils.getEndOfDay(new Date())
getDaysInMonth (year, month) 获取某月天数 utils.getDaysInMonth(2023, 2) // 28
isLeapYear (year) 是否闰年 utils.isLeapYear(2024) // true
getDateDetails (date) 获取详细日期信息 utils.getDateDetails(new Date()) // {year, month...}
isSameDay (date1, date2) 是否同一天 utils.isSameDay(d1, d2)
compareDate (date1, date2) 比较日期大小 utils.compareDate(d1, d2) // 1, -1, 0
isBirthday (birthday, dateToCheck) 是否生日 utils.isBirthday('1990-10-01') // true/false

2. 字符串与数字 (String & Number)

方法名 参数 描述 示例
truncateString (str, length) 字符串截断 utils.truncateString('这是一个很长的文本', 5) // "这是一个..."
formatMoney (number, decimals) 金额千分位 utils.formatMoney(12345.67) // "12,345.67"
formatFileSize (size) 文件大小格式化 utils.formatFileSize(1024) // "1.00 KB"
formatPhoneNumber (phone, separator) 手机号344格式 utils.formatPhoneNumber('***') // "138 0013 8000"
maskString (str, start, end, mask) 字符串脱敏 utils.maskString('***') // "138****8000"
camelToKebab (str) 驼峰转连字符 utils.camelToKebab('fooBar') // "foo-bar"
kebabToCamel (str) 连字符转驼峰 utils.kebabToCamel('foo-bar') // "fooBar"
clamp (num, min, max) 限制数字范围 utils.clamp(120, 0, 100) // 100
randomString (len) 随机字符串 utils.randomString(16)
padZero (num) 数字补零 utils.padZero(5) // "05"

3. 数据校验 (Validation)

方法名 参数 描述 示例
isPhoneNumber (phone) 验证手机号 utils.isPhoneNumber('***')
isEmail (email) 验证邮箱 utils.isEmail('test@example.com')
isIDCard (idCard) 验证身份证 utils.isIDCard('110101199003071234')
isEmpty (value) 验证空值 utils.isEmpty([]) // true

4. 树形结构操作 (Tree) ✨

方法名 参数 描述 示例
listToTree (list, id, pid, children) 列表转树 utils.listToTree(list)
treeToList (tree, children) 树转列表 utils.treeToList(tree)
findNode (tree, func, children) 查找节点 utils.findNode(tree, node => node.id === 1)

5. URL 与 数组处理 (URL & Array)

方法名 参数 描述 示例
parseUrlParams (url) URL参数解析 utils.parseUrlParams('?id=1') // {id: "1"}
objToUrlParams (obj) 对象转URL参数 utils.objToUrlParams({id:1}) // "id=1"
uniqueArray (arr) 数组去重 utils.uniqueArray([1,1,2]) // [1,2]
shuffleArray (arr) 数组乱序 utils.shuffleArray([1,2,3])
groupBy (arr, key) 数组分组 utils.groupBy(list, 'type')

6. 颜色处理 (Color)

方法名 参数 描述 示例
hexToRgba (hex, opacity) Hex转RGBA utils.hexToRgba('#ff0000', 0.5)

7. UI 与 系统 (UI & System)

方法名 参数 描述 示例
toast (title, icon, duration) 提示框 utils.toast('成功', 'success')
showLoading (title) 显示Loading utils.showLoading()
hideLoading () 隐藏Loading utils.hideLoading()
showModal (content, title, showCancel) 模态弹窗(Promise) await utils.showModal('确认删除?')
copy (content) 复制文本 utils.copy('text')
makePhoneCall (phone) 拨打电话 utils.makePhoneCall('10086')

8. 节点与尺寸 (Node & Size) ✨

方法名 参数 描述 示例
getRect (selector, component) 获取节点信息 await utils.getRect('.box', this)
getRectAll (selector, component) 获取所有节点信息 await utils.getRectAll('.item', this)
px2rpx (px) px转rpx utils.px2rpx(100)
rpx2px (rpx) rpx转px utils.rpx2px(200)

9. 对象操作 (Object) ✨

方法名 参数 描述 示例
pick (obj, keys) 选取属性 utils.pick({a:1,b:2}, ['a']) // {a:1}
omit (obj, keys) 排除属性 utils.omit({a:1,b:2}, ['b']) // {a:1}

10. 辅助函数 (Helper) ✨

方法名 参数 描述 示例
sleep (ms) 睡眠/延迟 await utils.sleep(1000)
random (min, max) 范围随机数 utils.random(10, 20)
safeJSONParse (str, defaultValue) 安全解析JSON utils.safeJSONParse('bad json', {})

11. 更多校验 (Validation) ✨

方法名 参数 描述 示例
isURL (str) 验证URL utils.isURL('https://...')
isChinese (str) 验证中文 utils.isChinese('你好')

12. 增强 uni-app 功能

方法名 参数 描述 示例
routerPush (url, params) 带参路由跳转 utils.routerPush('/pages/test', {id:1})
previewImage (urls, current) 图片预览 utils.previewImage(['http...'])

13. 其他

  • setStorage / getStorage / removeStorage / clearStorage: 安全的缓存操作
  • debounce / throttle: 防抖与节流
  • deepClone: 深拷贝

隐私、权限声明

1. 本插件需要申请的系统权限列表:

2. 本插件采集的数据、发送的服务器地址、以及数据用途说明:

3. 本插件是否包含广告,如包含需详细说明广告表达方式、展示频率:

许可协议

MIT协议

暂无用户评论。