更新记录
1.2.1(2023-03-22)
changelog.md保持同步
1.2.0(2023-03-21)
增加js方法
1.1.9(2023-03-21)
1
查看更多
平台兼容性
HbuilderX/cli最低兼容版本 |
3.3.12 |
uni-app
app-vue |
app-nvue |
app-android |
app-ios |
? |
? |
? |
? |
H5-Safari |
Android Browser |
微信浏览器(Android) |
QQ浏览器(Android) |
Chrome |
IE |
Edge |
Firefox |
PC-Safari |
? |
? |
? |
? |
? |
? |
? |
? |
? |
微信小程序 |
支付宝小程序 |
百度小程序 |
字节小程序 |
QQ小程序 |
钉钉小程序 |
快手小程序 |
飞书小程序 |
京东小程序 |
? |
? |
? |
? |
? |
? |
? |
? |
? |
uni-app x
H5-Safari |
Android Browser |
微信浏览器(Android) |
QQ浏览器(Android) |
Chrome |
IE |
Edge |
Firefox |
PC-Safari |
? |
? |
? |
? |
? |
? |
? |
? |
? |
yy-base🍒🍒🍒🍒
插件概述🍒🍒🍒🍒
yybase插件是封装好的JavaScript文件,可在yybase应用中直接调用,提供丰富的功能和扩展性。插件已经集合了color-ui,项目中可以直接使用。🍒🍒🍒🍒
结构说明🍒🍒🍒🍒
📦yy-base
├── 📜changelog.md
├── 📜components➖➖➖➖组件库
├── 📜config.js➖➖➖➖配置为了将
├── 📜index.js➖➖➖➖组件库索引
├── 📜index.scss➖➖➖➖样式库索引
├── 📂js
│ ├── 📜index.js➖➖➖➖函数库索引
│ ├── 📂mixin➖➖➖➖混入父类
│ │ └── 📜mixin.js➖➖➖➖全路婚礼
│ └── 📂tools➖➖➖➖函数库
│ ├── 📜array.js➖➖➖➖数组
│ ├── 📜cache.js➖➖➖➖缓存
│ ├── 📜dialog.js➖➖➖➖弹框
│ ├── 📜eventBus.js➖➖➖➖事务
│ ├── 📜jump.js➖➖➖➖跳转
│ ├── 📜number.js➖➖➖➖数字
│ ├── 📜object.js➖➖➖➖对象
│ ├── 📜request.js➖➖➖➖请求
│ └── 📜string.js➖➖➖➖字符串
├── 📜package.json
├── 📜readme.md
└── 📂styles➖➖➖➖样式库
├── 📂color-ui
│ ├── 📜animation.css➖➖➖➖动画css
│ ├── 📜icon.css➖➖➖➖图标css
│ └── 📜main.css➖➖➖➖colorUI主样式
└── 📜index.scss➖➖➖➖样式库索引
安装使用🍒🍒🍒🍒
全局使用yybase.js🍒🍒🍒🍒
// 引入全局yybase.js - main.js
import yyBase from '@/uni_modules/yy-base'
Vue.use(yyBase)
全局使用yybase.css🍒🍒🍒🍒
// 引入全局yybase.css - App.vue
<style lang="scss">
/*每个页面公共css */
@import 'uni_modules/yy-base/index.scss';
</style>
yybase.js部分示例🍒🍒🍒🍒
// 示例1:隐藏手机号中间4位
const phone = '13812345678';
const maskedPhone = yy.maskString(phone, 3, 6);
console.log(maskedPhone); // 输出:138****5678
// 示例2:隐藏身份证号中间6位
const idCard = '110101199001010001';
const maskedIdCard = yy.maskString(idCard, 6, 11, '#');
console.log(maskedIdCard); // 输出:110101######0001
// 示例3:start和end不是数字或小于0,返回原字符串
const str1 = 'hello world';
const maskedStr1 = yy.maskString(str1, 'a', -1);
console.log(maskedStr1); // 输出:hello world
// 示例4:start大于等于end,返回原字符串
const str2 = 'hello world';
const maskedStr2 = yy.maskString(str2, 5, 3);
console.log(maskedStr2); // 输出:hello world
// 示例5:end大于等于str.length,end会自动调整为str.length-1
const str3 = 'hello world';
const maskedStr3 = yy.maskString(str3, 6, 20);
console.log(maskedStr3); // 输出:hello w*****
请求拦截示例🍒🍒🍒🍒
- 🍒🍒配置根域名 - yybase>config.js🍒🍒
export default {
// 根域名
baseUrl: "http://byxw.wq.com",
// 登录页面路径
loginUrl: '/pages/test/test',
// 白名单,不需要登录就能访问的页面
whiteList: [
'/pages/index/index', '/pages/test/test', '/pages/index/indexs'
],
// 分享配置
share: {
title: '分享标题',
path: '/pages/index/index',
imageUrl: '',
desc: ''
}
}
- 🍒🍒配置请求拦截器 - yybase>js>tools>request.js🍒🍒
setInterceptor(config => {
config.header.Authorization = `Bearer 11111111111`;
return Promise.reject(config)
})
- 🍒🍒请求示例🍒🍒
// 获取数据
async getList() {
const { data, statusCode } = await yy.req({
url: '/api/config',
method: 'get', //默认get
loading: true, // 请求loading开关 ,默认true
toastError: true // 保存提示消息开关 ,默认true
});
},
// 请求成功会默认打印出数据
路由跳转拦截🍒🍒🍒🍒
- 🍒🍒配置登录页面路径,路由白名单 - yybase>config.js🍒🍒
export default {
// 根域名
baseUrl: "http://byxw.wq.com",
// 登录页面路径
loginUrl: '/pages/test/test',
// 白名单,不需要登录就能访问的页面
whiteList: [
'/pages/index/index', '/pages/test/test', '/pages/index/indexs'
],
// 分享配置
share: {
title: '分享标题',
path: '/pages/index/index',
imageUrl: '',
desc: ''
}
}
- 🍒🍒配置自己的跳转逻辑 - yybase>jump.js🍒🍒
function isLoggedIn(url) {
const token = uni.getStorageSync('token');
// 判断当前路由是否在白名单中,在返回true,不在返回false
const isWhiteListed = [...whiteList, config.loginUrl].includes(url);
// 如果当前路由在白名单中 并且未登录
if (isWhiteListed && token) {
return true;
}
// 否则返回 false
return false;
}
- 🍒🍒跳转示例🍒🍒
yy.jump('/pages/index/new')
函数集合(后续会连续增加,也可以评论反应看到后会进行增加)🍒🍒🍒🍒
函数名称 |
函数描述 |
参数 |
返回值 |
arrToTree |
数组转树 |
arr: Array, idField: String = 'id', parentField: String = 'parentId', childrenField: String = 'children' |
树形结构数组 |
treeToArray |
将树形结构转换为数组结构 |
tree: Object[], idKey: String = 'id', childrenKey: String = 'children' |
数组结构数据 |
isEmptyArray |
判断数组是否为空 |
arr: Array |
boolean |
isNotEmptyArray |
判断数组是否不为空 |
arr: Array |
boolean |
mergeArrays |
将多个数组合并成一个新数组 |
...arrays: Array |
Array |
sumArray |
计算数组中所有元素的和 |
arr: Array |
number |
flattenArray |
将二维数组转换为一维数组 |
arr: Array |
Array |
shuffleArray |
将数组元素随机打乱 |
arr: Array |
打乱后的新数组 |
removeDuplicates |
删除数组中的重复元素 |
arr: Array |
删除重复元素后的新数组 |
maxArray |
找出数组中的最大值 |
arr: Array |
number/null |
minArray |
找出数组中的最小值 |
arr: Array |
number/null |
averageArray |
计算数组中所有元素的平均值 |
arr: Array |
number/null |
removeEmpty |
去除数组中的空值 |
arr: Array |
去除空值后的新数组 |
hasIntersection |
判断两个数组是否有交集 |
arr1: any[], arr2: any[] |
boolean |
isArray |
判断变量是否为数组类型 |
variable: any |
boolean |
quickSort |
对数组进行快速排序 顺序 |
arr: Array |
排序后的数组 |
quickSortDescending |
对数组进行快速排序(倒序) |
arr: Array |
排序后的数组 |
--- |
--- |
--- |
--- |
--- |
--- |
--- |
--- |
--- |
--- |
--- |
--- |
setCache |
将指定数据保存到缓存中 |
- key:缓存键名 - value:缓存值 - expire:过期时间(单位:秒),默认为 -1 表示永不过期 |
无 |
getCache |
从缓存中获取指定键名的数据 |
- key:缓存键名 - defaultValue:默认值,如果缓存中不存在或已过期,则返回该默认值 |
缓存中的值或默认值 |
removeCache |
移除指定键名的缓存数据 |
- key:缓存键名 |
无 |
--- |
--- |
--- |
--- |
--- |
--- |
--- |
--- |
--- |
--- |
--- |
--- |
showToast |
消息提示框 |
title: string, duration: number=1500 |
无 |
showModal |
确认框 |
title: string, content: string, confirmText: string='确定', cancelText: string='取消' |
Promise |
showPrompt |
提示框 |
title: string, placeholder: string='', confirmText: string='确定', cancelText: string='取消' |
Promise |
showLoading |
加载框 |
title: string |
无 |
hideLoading |
隐藏加载框 |
无 |
无 |
showActionSheet |
操作菜单 |
itemList: Array, itemColor: string='#000000' |
Promise |
--- |
--- |
--- |
--- |
--- |
--- |
--- |
--- |
--- |
--- |
--- |
--- |
emit |
发布指定名称的事件 |
eventName: string, data: any, ...args: any |
void |
on |
订阅指定名称的事件 |
eventName: string, callback: Function |
取消订阅该事件的函数: Function |
once |
订阅指定名称的事件,并且只订阅一次,回调函数会在第一次触发后自动取消订阅 |
eventName: string, callback: Function |
void |
off |
取消订阅指定名称的事件 |
eventName: string, callback?: Function |
void |
--- |
--- |
--- |
--- |
--- |
--- |
--- |
--- |
--- |
--- |
--- |
--- |
navigateTo |
跳转到指定路由 |
url: String, params: Object |
无 |
reLaunch |
关闭所有页面,打开到应用内的某个页面 |
url: String |
无 |
switchTab |
跳转到 tabBar 页面,并关闭其他所有非 tabBar 页面 |
url: String |
无 |
navigateBack |
关闭当前页面,返回上一页面或多级页面 |
无 |
无 |
redirectTo |
重定向到指定路由 |
url: String |
无 |
isLoggedIn |
判断当前用户是否已登录 |
url: String |
Boolean |
--------------- |
---------------------------------------------------------------- |
------------------------------------------ |
----------- |
--------------- |
---------------------------------------------------------------- |
------------------------------------------ |
----------- |
--------------- |
---------------------------------------------------------------- |
------------------------------------------ |
----------- |
roundNumber |
将数字保留指定位数小数 |
num: 要处理的数字, digits: 要保留的小数位数 |
处理后的数字 |
formatCurrency |
将大数字转换为货币格式 |
number: 要转换的数字 |
货币格式字符串 |
numberToChinese |
将数字转换为中文大写 |
num: 要转换的数字,范围在[0, 999999999]之间 |
中文字符串 |
numberToChinese1 |
将数字转换为中文大写(采用“壹、贰、叁”等形式表示) |
num: 要转换的数字,范围在[0, 999999999]之间 |
中文字符串 |
--- |
--- |
--- |
--- |
--- |
--- |
--- |
--- |
--- |
--- |
--- |
--- |
mergeObjects |
合并多个对象 |
target: 目标对象, sources: 源对象 |
合并后的对象 |
objToUrlParams |
将对象转换为URL参数字符串 |
obj: 要转换的对象 |
转换后的URL参数字符串 |
urlToObj |
将链接转换成对象 |
url: 需要转换的链接 |
包含链接参数的对象 |
copyObject |
对象拷贝函数,根据参数控制进行深拷贝或浅拷贝 |
obj: 要拷贝的对象, deepCopy: 是否进行深拷贝,默认为false表示浅拷贝 |
拷贝后的新对象 |
getValueByKey |
根据key获取对象的值 |
obj: 要获取值的对象, key: 属性键名 |
对应属性的值,如果obj中不存在该属性则返回undefined |
allPropertiesAreNotEmpty |
检测整个对象是否没有空属性 |
obj: 要检测的对象 |
是否所有属性都不为空 |
arrayToJSON |
将对象数组转换为JSON格式 |
arr: 要转换的对象数组 |
对象数组的JSON字符串 |
deleteProperties |
删除对象中指定的属性,并返回新对象 |
obj: 要删除属性的对象, keys: 要删除的属性键名数组 |
删除对应属性后的新对象 |
pickProperties |
从对象中取多个属性,并生成一个全新的对象 |
obj: 要取属性的对象, keys: 要取的属性键名数组 |
包含对应属性的新对象 |
isObject |
判断变量是否为对象类型 |
varible: 要检查的变量 |
是否为对象类型 |
--- |
--- |
--- |
--- |
--- |
--- |
--- |
--- |
--- |
--- |
--- |
--- |
maskString |
将字符串中的中间字段隐藏 |
str: 待处理的字符串,start: 开始隐藏的位置,从0开始计数,end: 结束隐藏的位置,从0开始计数,mask: 用于替换隐藏字段的字符,默认为'*' |
处理后的字符串 |
formatTimestamp |
将时间戳格式化为指定格式的字符串 |
timestamp: 要格式化的时间戳,format: 格式字符串,默认为'YYYY-MM-DD HH:mm:ss' |
格式化后的字符串 |
fromNow |
计算距离当前时间的时间差 |
timestamp: 要计算的时间戳 |
时间差字符串 |
getActivityStatus |
判断当前时间是否在活动的开始时间、结束时间之间 |
startTime: 活动开始时间,endTime: 活动结束时间 |
当前时间所处的状态,可能取值为'未开始'、'进行中'或'已结束' |
randomColor |
生成随机颜色 |
无 |
随机颜色值 |
isQingming |
判断当前日期是否是清明节 |
无 |
是否是清明节 |
getQingmingDay |
获取指定年份的清明节日期 |
year: 指定年份 |
清明节日期 |
generateOrderNumber |
生成带指定开头多少位的订单号 |
len: 多少位,prefix: 什么开头, |
返回生成的订单号 |