mirror of
http://git.coreshop.cn/jianweie/coreshoppro.git
synced 2025-12-06 19:23:25 +08:00
升级uview2.0.15
This commit is contained in:
JianWeie
@@ -4,6 +4,11 @@
|
||||
<h3 align="center" style="margin: 30px 0 30px;font-weight: bold;font-size:40px;">uView</h3>
|
||||
<h3 align="center">多平台快速开发的UI框架</h3>
|
||||
|
||||
## 一起推动uView发展
|
||||
|
||||
uView正在参与开源中国的“年度最佳项目”评选，目前投票进入了最后一个阶段（之前投过票的现在也可以投票），
|
||||
我们不分昼夜的努力，恳请同学们能为我们投一票，uView来源于社区，也希望社区能一起推动它的发展，[点此帮助uView](https://www.oschina.net/project/top_cn_2021/?id=583)
|
||||
|
||||
|
||||
## 说明
|
||||
|
||||
|
||||
@@ -1,3 +1,18 @@
|
||||
## 2.0.15（2021-12-21）
|
||||
## uView正在参与开源中国的“年度最佳项目”评选，之前投过票的现在也可以投票，恳请同学们投一票，[点此帮助uView](https://www.oschina.net/project/top_cn_2021/?id=583)
|
||||
|
||||
# uView2.0重磅发布，利剑出鞘，一统江湖
|
||||
|
||||
1. 修复Cell单元格titleWidth无效
|
||||
2. 修复cheakbox组件ischecked不更新
|
||||
3. 修复keyboard是否显示"."按键默认值问题
|
||||
4. 修复number-keyboard是否显示键盘的"."符号问题
|
||||
5. 修复Input输入框 readonly无效
|
||||
6. 修复u-avatar 导致打包app、H5时候报错问题
|
||||
7. 修复Upload上传deletable无效
|
||||
8. 修复upload当设置maxSize时无效的问题
|
||||
9. 修复tabs lineWidth传入带单位的字符串的时候偏移量计算错误问题
|
||||
10. 修复rate组件在有padding的view内，显示的星星位置和可触摸区域不匹配，无法正常选中星星
|
||||
## 2.0.13（2021-12-14）
|
||||
## [点击加群交流反馈：364463526](https://jq.qq.com/?_chanwv=1027&k=mCxS3TGY)
|
||||
|
||||
|
||||
@@ -10,6 +10,7 @@
|
||||
@tap.stop="clickHandler"
|
||||
>
|
||||
<slot>
|
||||
<!-- #ifdef MP-WEIXIN || MP-QQ || MP-BAIDU -->
|
||||
<open-data
|
||||
v-if="mpAvatar && allowMp"
|
||||
type="userAvatarUrl"
|
||||
@@ -18,6 +19,10 @@
|
||||
height: $u.addUnit(size)
|
||||
}]"
|
||||
/>
|
||||
<!-- #endif -->
|
||||
<!-- #ifndef MP-WEIXIN && MP-QQ && MP-BAIDU -->
|
||||
<template v-if="mpAvatar && allowMp"></template>
|
||||
<!-- #endif -->
|
||||
<u-icon
|
||||
v-else-if="icon"
|
||||
:name="icon"
|
||||
@@ -56,8 +61,8 @@
|
||||
* Avatar 头像
|
||||
* @description 本组件一般用于展示头像的地方，如个人中心，或者评论列表页的用户头像展示等场所。
|
||||
* @tutorial https://www.uviewui.com/components/avatar.html
|
||||
*
|
||||
* @property {String} src 头像路径，如加载失败，将会显示默认头像(不能为相对路径)
|
||||
*
|
||||
* @property {String} src 头像路径，如加载失败，将会显示默认头像(不能为相对路径)
|
||||
* @property {String} shape 头像形状 （ circle (默认) | square）
|
||||
* @property {String | Number} size 头像尺寸，可以为指定字符串(large, default, mini)，或者数值 （默认 40 ）
|
||||
* @property {String} mode 头像图片的裁剪类型，与uni的image组件的mode参数一致，如效果达不到需求，可尝试传widthFix值 （默认 'scaleToFill' ）
|
||||
@@ -65,14 +70,14 @@
|
||||
* @property {String} bgColor 背景颜色，一般显示文字时用 （默认 '#c0c4cc' ）
|
||||
* @property {String} color 文字颜色 （默认 '#ffffff' ）
|
||||
* @property {String | Number} fontSize 文字大小 （默认 18 ）
|
||||
* @property {String} icon 显示的图标
|
||||
* @property {String} icon 显示的图标
|
||||
* @property {Boolean} mpAvatar 显示小程序头像，只对百度，微信，QQ小程序有效 （默认 false ）
|
||||
* @property {Boolean} randomBgColor 是否使用随机背景色 （默认 false ）
|
||||
* @property {String} defaultUrl 加载失败的默认头像(组件有内置默认图片)
|
||||
* @property {String | Number} colorIndex 如果配置了randomBgColor为true，且配置了此值，则从默认的背景色数组中取出对应索引的颜色值，取值0-19之间
|
||||
* @property {String} defaultUrl 加载失败的默认头像(组件有内置默认图片)
|
||||
* @property {String | Number} colorIndex 如果配置了randomBgColor为true，且配置了此值，则从默认的背景色数组中取出对应索引的颜色值，取值0-19之间
|
||||
* @property {String} name 组件标识符 （默认 'level' ）
|
||||
* @property {Object} customStyle 定义需要用到的外部样式
|
||||
*
|
||||
*
|
||||
* @event {Function} click 点击组件时触发 index: 用户传递的标识符
|
||||
* @example <u-avatar :src="src" mode="square"></u-avatar>
|
||||
*/
|
||||
|
||||
@@ -22,8 +22,7 @@
|
||||
:cursor="cursor"
|
||||
:value="innerValue"
|
||||
:auto-blur="autoBlur"
|
||||
:disabled="disabled"
|
||||
:readonly="readonly"
|
||||
:disabled="disabled || readonly"
|
||||
:maxlength="maxlength"
|
||||
:placeholder="placeholder"
|
||||
:placeholder-style="placeholderStyle"
|
||||
|
||||
@@ -75,7 +75,7 @@
|
||||
* @description 此为uViw自定义的键盘面板，内含了数字键盘，车牌号键，身份证号键盘3中模式，都有可以打乱按键顺序的选项。
|
||||
* @tutorial https://www.uviewui.com/components/keyboard.html
|
||||
* @property {String} mode 键盘类型，见官网基本使用的说明 （默认 'number' ）
|
||||
* @property {Boolean} dotDisabled 是否显示"."按键，只在mode=number时有效 （默认 true ）
|
||||
* @property {Boolean} dotDisabled 是否显示"."按键，只在mode=number时有效 （默认 false ）
|
||||
* @property {Boolean} tooltip 是否显示键盘顶部工具条 （默认 true ）
|
||||
* @property {Boolean} showTips 是否显示工具条中间的提示 （默认 true ）
|
||||
* @property {String} tips 工具条中间的提示文字，见上方基本使用的说明，如不需要，请传""空字符
|
||||
|
||||
@@ -1,64 +1,69 @@
|
||||
export default {
|
||||
props: {
|
||||
// 是否开启顶部安全区适配
|
||||
safeAreaInsetTop: {
|
||||
type: Boolean,
|
||||
default: uni.$u.props.navbar.safeAreaInsetTop
|
||||
},
|
||||
// 固定在顶部时，是否生成一个等高元素，以防止塌陷
|
||||
placeholder: {
|
||||
type: Boolean,
|
||||
default: uni.$u.props.navbar.placeholder
|
||||
},
|
||||
// 是否固定在顶部
|
||||
fixed: {
|
||||
type: Boolean,
|
||||
default: uni.$u.props.navbar.fixed
|
||||
},
|
||||
// 是否显示下边框
|
||||
border: {
|
||||
type: Boolean,
|
||||
default: uni.$u.props.navbar.border
|
||||
},
|
||||
// 左边的图标
|
||||
leftIcon: {
|
||||
type: String,
|
||||
default: uni.$u.props.navbar.leftIcon
|
||||
},
|
||||
// 左边的提示文字
|
||||
leftText: {
|
||||
type: String,
|
||||
default: uni.$u.props.navbar.leftText
|
||||
},
|
||||
// 左右的提示文字
|
||||
rightText: {
|
||||
type: String,
|
||||
default: uni.$u.props.navbar.rightText
|
||||
},
|
||||
// 右边的图标
|
||||
rightIcon: {
|
||||
type: String,
|
||||
default: uni.$u.props.navbar.rightIcon
|
||||
},
|
||||
// 标题
|
||||
title: {
|
||||
type: [String, Number],
|
||||
default: uni.$u.props.navbar.title
|
||||
},
|
||||
// 背景颜色
|
||||
bgColor: {
|
||||
type: String,
|
||||
default: uni.$u.props.navbar.bgColor
|
||||
},
|
||||
// 标题的宽度
|
||||
titleWidth: {
|
||||
type: [String, Number],
|
||||
default: uni.$u.props.navbar.titleWidth
|
||||
},
|
||||
// 导航栏高度
|
||||
height: {
|
||||
type: [String, Number],
|
||||
default: uni.$u.props.navbar.height
|
||||
}
|
||||
}
|
||||
props: {
|
||||
// 是否开启顶部安全区适配
|
||||
safeAreaInsetTop: {
|
||||
type: Boolean,
|
||||
default: uni.$u.props.navbar.safeAreaInsetTop
|
||||
},
|
||||
// 固定在顶部时，是否生成一个等高元素，以防止塌陷
|
||||
placeholder: {
|
||||
type: Boolean,
|
||||
default: uni.$u.props.navbar.placeholder
|
||||
},
|
||||
// 是否固定在顶部
|
||||
fixed: {
|
||||
type: Boolean,
|
||||
default: uni.$u.props.navbar.fixed
|
||||
},
|
||||
// 是否显示下边框
|
||||
border: {
|
||||
type: Boolean,
|
||||
default: uni.$u.props.navbar.border
|
||||
},
|
||||
// 左边的图标
|
||||
leftIcon: {
|
||||
type: String,
|
||||
default: uni.$u.props.navbar.leftIcon
|
||||
},
|
||||
// 左边的提示文字
|
||||
leftText: {
|
||||
type: String,
|
||||
default: uni.$u.props.navbar.leftText
|
||||
},
|
||||
// 左右的提示文字
|
||||
rightText: {
|
||||
type: String,
|
||||
default: uni.$u.props.navbar.rightText
|
||||
},
|
||||
// 右边的图标
|
||||
rightIcon: {
|
||||
type: String,
|
||||
default: uni.$u.props.navbar.rightIcon
|
||||
},
|
||||
// 标题
|
||||
title: {
|
||||
type: [String, Number],
|
||||
default: uni.$u.props.navbar.title
|
||||
},
|
||||
// 背景颜色
|
||||
bgColor: {
|
||||
type: String,
|
||||
default: uni.$u.props.navbar.bgColor
|
||||
},
|
||||
// 标题的宽度
|
||||
titleWidth: {
|
||||
type: [String, Number],
|
||||
default: uni.$u.props.navbar.titleWidth
|
||||
},
|
||||
// 导航栏高度
|
||||
height: {
|
||||
type: [String, Number],
|
||||
default: uni.$u.props.navbar.height
|
||||
},
|
||||
// 左侧返回图标的大小
|
||||
leftIconSize: {
|
||||
type: [String, Number],
|
||||
default: uni.$u.props.navbar.leftIconSize
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -30,7 +30,7 @@
|
||||
<u-icon
|
||||
v-if="leftIcon"
|
||||
:name="leftIcon"
|
||||
size="20"
|
||||
:size="leftIconSize"
|
||||
></u-icon>
|
||||
<text
|
||||
v-if="leftText"
|
||||
@@ -82,8 +82,9 @@
|
||||
* @property {String} rightIcon 右边返回图标的名称，只能为uView自带的图标
|
||||
* @property {String} title 导航栏标题，如设置为空字符，将会隐藏标题占位区域
|
||||
* @property {String} bgColor 导航栏背景设置 （默认 '#ffffff' ）
|
||||
* @property {String | Number} titleWidth 导航栏标题的最大宽度，内容超出会以省略号隐藏，单位px （默认 '400rpx' ）
|
||||
* @property {String | Number} height 导航栏高度(不包括状态栏高度在内，内部自动加上)，单位px （默认 '44px' ）
|
||||
* @property {String | Number} titleWidth 导航栏标题的最大宽度，内容超出会以省略号隐藏 （默认 '400rpx' ）
|
||||
* @property {String | Number} height 导航栏高度(不包括状态栏高度在内，内部自动加上)（默认 '44px' ）
|
||||
* @property {String | Number} leftIconSize 左侧返回图标的大小（默认 20px ）
|
||||
* @event {Function} leftClick 点击左侧区域
|
||||
* @event {Function} rightClick 点击右侧区域
|
||||
* @example <u-navbar title="剑未配妥，出门已是江湖" left-text="返回" right-text="帮助" @click-left="onClickBack" @click-right="onClickRight"></u-navbar>
|
||||
|
||||
@@ -43,14 +43,14 @@
|
||||
|
||||
/**
|
||||
* keyboard 键盘组件
|
||||
* @description
|
||||
* @tutorial
|
||||
* @description
|
||||
* @tutorial
|
||||
* @property {String} mode 键盘的类型，number-数字键盘，card-身份证键盘
|
||||
* @property {Boolean} dotEnable 是否显示键盘的"."符号
|
||||
* @property {Boolean} dotDisabled 是否显示键盘的"."符号
|
||||
* @property {Boolean} random 是否打乱键盘按键的顺序
|
||||
* @event {Function} change 点击键盘触发
|
||||
* @event {Function} backspace 点击退格键触发
|
||||
* @example
|
||||
* @example
|
||||
*/
|
||||
export default {
|
||||
mixins: [uni.$u.mpMixin, uni.$u.mixin, props],
|
||||
@@ -164,7 +164,7 @@
|
||||
border-top-right-radius: $u-number-keyboard-button-border-top-right-radius;
|
||||
border-bottom-left-radius: $u-number-keyboard-button-border-bottom-left-radius;
|
||||
border-bottom-right-radius: $u-number-keyboard-button-border-bottom-right-radius;
|
||||
|
||||
|
||||
&__button {
|
||||
width: $u-number-keyboard-button-width;
|
||||
height: $u-number-keyboard-button-height;
|
||||
@@ -176,13 +176,13 @@
|
||||
border-top-right-radius: $u-number-keyboard-button-border-top-right-radius;
|
||||
border-bottom-left-radius: $u-number-keyboard-button-border-bottom-left-radius;
|
||||
border-bottom-right-radius: $u-number-keyboard-button-border-bottom-right-radius;
|
||||
|
||||
|
||||
&__text {
|
||||
font-size: $u-number-keyboard-text-font-size;
|
||||
font-weight: $u-number-keyboard-text-font-weight;
|
||||
color: $u-number-keyboard-text-color;
|
||||
}
|
||||
|
||||
|
||||
&--gray {
|
||||
background-color: $u-number-keyboard-gray-background-color;
|
||||
}
|
||||
|
||||
@@ -195,7 +195,7 @@
|
||||
// nvue下，无法通过点击获得坐标信息，这里通过元素的位置尺寸值模拟坐标
|
||||
x = index * this.rateWidth + this.rateBoxLeft;
|
||||
// #endif
|
||||
this.getActiveIndex(x);
|
||||
this.getActiveIndex(x,true);
|
||||
},
|
||||
// 发出事件
|
||||
emitEvent() {
|
||||
@@ -205,14 +205,14 @@
|
||||
this.$emit("input", this.activeIndex);
|
||||
},
|
||||
// 获取当前激活的评分图标
|
||||
getActiveIndex(x) {
|
||||
getActiveIndex(x,isClick = false) {
|
||||
if (this.disabled) {
|
||||
return;
|
||||
}
|
||||
// 判断当前操作的点的x坐标值，是否在允许的边界范围内
|
||||
const allRateWidth = this.rateWidth * this.count + this.rateBoxLeft;
|
||||
// 如果小于第一个图标的左边界，设置为最小值，如果大于所有图标的宽度，则设置为最大值
|
||||
x = uni.$u.range(this.rateBoxLeft, allRateWidth, x);
|
||||
x = uni.$u.range(this.rateBoxLeft, allRateWidth, x) - this.rateBoxLeft
|
||||
// 滑动点相对于评分盒子左边的距离
|
||||
const distance = x;
|
||||
// 滑动的距离，相当于多少颗星星
|
||||
@@ -232,16 +232,23 @@
|
||||
// 取余，判断小数的区间范围
|
||||
const decimal = distance % this.rateWidth;
|
||||
// 非半星时，只有超过了图标的一半距离，才认为是选择了这颗星
|
||||
if (decimal > this.rateWidth / 2) {
|
||||
index++;
|
||||
if (isClick){
|
||||
if (decimal > 0) index++;
|
||||
} else {
|
||||
if (decimal > this.rateWidth / 2) index++;
|
||||
}
|
||||
|
||||
}
|
||||
this.activeIndex = Math.min(index, this.count);
|
||||
// 对最少颗星星的限制
|
||||
if (this.activeIndex < this.minCount) {
|
||||
this.activeIndex = this.minCount;
|
||||
}
|
||||
this.moving = true;
|
||||
|
||||
// 设置延时为了让click事件在touchmove之前触发
|
||||
setTimeout(() => {
|
||||
this.moving = true;
|
||||
}, 10);
|
||||
// 一定时间后，取消标识为移动中状态，是为了让click事件无效
|
||||
setTimeout(() => {
|
||||
this.moving = false;
|
||||
@@ -272,10 +279,10 @@ $u-rate-item-icon-wrap-half-left: 0 !default;
|
||||
|
||||
&__content {
|
||||
@include flex;
|
||||
|
||||
|
||||
&__item {
|
||||
position: relative;
|
||||
|
||||
|
||||
&__icon-wrap {
|
||||
&--half {
|
||||
position: absolute;
|
||||
|
||||
@@ -215,6 +215,7 @@
|
||||
}
|
||||
|
||||
&--column {
|
||||
position: relative;
|
||||
flex-direction: row;
|
||||
justify-content: flex-start;
|
||||
padding-bottom: 5px;
|
||||
@@ -257,6 +258,7 @@
|
||||
border-radius: 100px;
|
||||
border-width: 1px;
|
||||
border-color: $u-tips-color;
|
||||
border-style: solid;
|
||||
@include flex(row);
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
|
||||
@@ -162,7 +162,17 @@
|
||||
let lineOffsetLeft = this.list
|
||||
.slice(0, this.innerCurrent)
|
||||
.reduce((total, curr) => total + curr.rect.width, 0);
|
||||
this.lineOffsetLeft = lineOffsetLeft + (tabItem.rect.width - this.lineWidth) / 2
|
||||
let lineWidth = this.lineWidth; // 拷贝副本，防止间接修改props中的值
|
||||
// 如果lineWidth不是数字类型的话
|
||||
if (typeof lineWidth !== 'number') {
|
||||
// 判断后缀是否为rpx
|
||||
if (lineWidth.indexOf('rpx') > -1) {
|
||||
lineWidth = uni.upx2px(parseFloat(lineWidth)); // rpx -> px
|
||||
} else {
|
||||
lineWidth = parseFloat(lineWidth);
|
||||
}
|
||||
}
|
||||
this.lineOffsetLeft = lineOffsetLeft + (tabItem.rect.width - lineWidth) / 2
|
||||
// #ifdef APP-NVUE
|
||||
// 第一次移动滑块，无需过渡时间
|
||||
this.animation(this.lineOffsetLeft, this.firstTime ? 0 : parseInt(this.duration))
|
||||
|
||||
@@ -190,7 +190,7 @@
|
||||
Object.assign(Object.assign({}, item), {
|
||||
isImage: uni.$u.test.image(item.url),
|
||||
isVideo: uni.$u.test.video(item.url),
|
||||
deletable: typeof(item.deletable) === 'boolean' ? item.deletable : true,
|
||||
deletable: typeof(item.deletable) === 'boolean' ? item.deletable : this.deletable,
|
||||
})
|
||||
);
|
||||
this.lists = lists
|
||||
|
||||
@@ -16,7 +16,8 @@ function formatImage(res) {
|
||||
...pickExclude(item, ['path']),
|
||||
type: 'image',
|
||||
url: item.path,
|
||||
thumb: item.path
|
||||
thumb: item.path,
|
||||
size: item.size
|
||||
}))
|
||||
}
|
||||
|
||||
@@ -26,7 +27,8 @@ function formatVideo(res) {
|
||||
...pickExclude(res, ['tempFilePath', 'thumbTempFilePath', 'errMsg']),
|
||||
type: 'video',
|
||||
url: res.tempFilePath,
|
||||
thumb: res.thumbTempFilePath
|
||||
thumb: res.thumbTempFilePath,
|
||||
size: res.size
|
||||
}
|
||||
]
|
||||
}
|
||||
@@ -36,12 +38,13 @@ function formatMedia(res) {
|
||||
...pickExclude(item, ['fileType', 'thumbTempFilePath', 'tempFilePath']),
|
||||
type: res.type,
|
||||
url: item.tempFilePath,
|
||||
thumb: res.type === 'video' ? item.thumbTempFilePath : item.tempFilePath
|
||||
thumb: res.type === 'video' ? item.thumbTempFilePath : item.tempFilePath,
|
||||
size: item.size
|
||||
}))
|
||||
}
|
||||
|
||||
function formatFile(res) {
|
||||
return res.tempFiles.map((item) => ({ ...pickExclude(item, ['path']), url: item.path }))
|
||||
return res.tempFiles.map((item) => ({ ...pickExclude(item, ['path']), url: item.path, size:item.size }))
|
||||
}
|
||||
export function chooseFile({
|
||||
accept,
|
||||
|
||||
@@ -1,3 +1,8 @@
|
||||
// 看到此报错，是因为没有配置vue.config.js的【transpileDependencies】，详见：https://www.uviewui.com/components/npmSetting.html#_5-cli模式额外配置
|
||||
const pleaseSetTranspileDependencies = {}, babelTest = pleaseSetTranspileDependencies?.test
|
||||
|
||||
|
||||
|
||||
// 引入全局mixin
|
||||
import mixin from './libs/mixin/mixin.js'
|
||||
// 小程序特有的mixin
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
// 此版本发布于2020-12-15
|
||||
const version = '2.0.13'
|
||||
// 此版本发布于2020-12-21
|
||||
const version = '2.0.15'
|
||||
|
||||
export default {
|
||||
v: version,
|
||||
|
||||
@@ -22,6 +22,7 @@ export default {
|
||||
fontSize: 18,
|
||||
size: 35,
|
||||
disabledKeyboard: false,
|
||||
borderColor: '#c9cacc'
|
||||
borderColor: '#c9cacc',
|
||||
disabledDot: true
|
||||
}
|
||||
}
|
||||
|
||||
@@ -10,7 +10,7 @@
|
||||
export default {
|
||||
// navbar 组件
|
||||
navbar: {
|
||||
safeAreaInsetTop: false,
|
||||
safeAreaInsetTop: true,
|
||||
placeholder: false,
|
||||
fixed: false,
|
||||
border: false,
|
||||
@@ -21,7 +21,8 @@ export default {
|
||||
title: '',
|
||||
bgColor: '#ffffff',
|
||||
titleWidth: '400rpx',
|
||||
height: '44px'
|
||||
height: '44px',
|
||||
leftIconSize: 20
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
@@ -1,15 +1,20 @@
|
||||
import test from './test.js'
|
||||
|
||||
/**
|
||||
* 如果value小于min，取min；如果value大于max，取max
|
||||
* @description 如果value小于min，取min；如果value大于max，取max
|
||||
* @param {number} min
|
||||
* @param {number} max
|
||||
* @param {number} value
|
||||
*/
|
||||
function range(min = 0, max = 0, value = 0) {
|
||||
return Math.max(min, Math.min(max, Number(value)))
|
||||
}
|
||||
|
||||
/**
|
||||
* 用于获取用户传递值的px值
|
||||
* 如果用户传递了"xxpx"或者"xxrpx"，取出其数值部分，如果是"xxxrpx"还需要用过uni.upx2px进行转换
|
||||
* @description 用于获取用户传递值的px值 如果用户传递了"xxpx"或者"xxrpx"，取出其数值部分，如果是"xxxrpx"还需要用过uni.upx2px进行转换
|
||||
* @param {number|string} value 用户传递值的px值
|
||||
* @param {boolean} unit
|
||||
* @returns {number|string}
|
||||
*/
|
||||
function getPx(value, unit = false) {
|
||||
if (test.number(value)) {
|
||||
@@ -22,9 +27,10 @@ function getPx(value, unit = false) {
|
||||
return unit ? `${parseInt(value)}px` : parseInt(value)
|
||||
}
|
||||
|
||||
/**
|
||||
* 进行延时，以达到可以简写代码的目的，比如
|
||||
* await uni.$u.sleep(20)将会阻塞20ms
|
||||
/**
|
||||
* @description 进行延时，以达到可以简写代码的目的 比如: await uni.$u.sleep(20)将会阻塞20ms
|
||||
* @param {number} value 堵塞时间 单位ms 毫秒
|
||||
* @returns {Promise} 返回promise
|
||||
*/
|
||||
function sleep(value = 30) {
|
||||
return new Promise((resolve) => {
|
||||
@@ -33,17 +39,24 @@ function sleep(value = 30) {
|
||||
}, value)
|
||||
})
|
||||
}
|
||||
|
||||
/**
|
||||
* @description 运行期判断平台
|
||||
* @returns {string} 返回所在平台(小写)
|
||||
* @link 运行期判断平台 https://uniapp.dcloud.io/frame?id=判断平台
|
||||
*/
|
||||
function os() {
|
||||
return uni.getSystemInfoSync().platform.toLowerCase()
|
||||
}
|
||||
|
||||
/**
|
||||
* @description 获取系统信息同步接口
|
||||
* @link 获取系统信息同步接口 https://uniapp.dcloud.io/api/system/info?id=getsysteminfosync
|
||||
*/
|
||||
function sys() {
|
||||
return uni.getSystemInfoSync()
|
||||
}
|
||||
|
||||
/**
|
||||
* 取一个区间数
|
||||
* @description 取一个区间数
|
||||
* @param {Number} min 最小值
|
||||
* @param {Number} max 最大值
|
||||
*/
|
||||
@@ -94,10 +107,13 @@ function guid(len = 32, firstU = true, radix = null) {
|
||||
return uuid.join('')
|
||||
}
|
||||
|
||||
// 获取父组件的参数，因为支付宝小程序不支持provide/inject的写法
|
||||
// this.$parent在非H5中，可以准确获取到父组件，但是在H5中，需要多次this.$parent.$parent.xxx
|
||||
// 这里默认值等于undefined有它的含义，因为最顶层元素(组件)的$parent就是undefined，意味着不传name
|
||||
// 值(默认为undefined)，就是查找最顶层的$parent
|
||||
/**
|
||||
* @description 获取父组件的参数，因为支付宝小程序不支持provide/inject的写法
|
||||
this.$parent在非H5中，可以准确获取到父组件，但是在H5中，需要多次this.$parent.$parent.xxx
|
||||
这里默认值等于undefined有它的含义，因为最顶层元素(组件)的$parent就是undefined，意味着不传name
|
||||
值(默认为undefined)，就是查找最顶层的$parent
|
||||
* @param {string|undefined} name 父组件的参数名
|
||||
*/
|
||||
function $parent(name = undefined) {
|
||||
let parent = this.$parent
|
||||
// 通过while历遍，这里主要是为了H5需要多层解析的问题
|
||||
@@ -114,10 +130,11 @@ function $parent(name = undefined) {
|
||||
}
|
||||
|
||||
/**
|
||||
* 样式转换
|
||||
* @description 样式转换
|
||||
* 对象转字符串，或者字符串转对象
|
||||
* @param {Object | String} 需要转换的目标
|
||||
* @param {String} 转换的目的，object-转为对象，string-转为字符串
|
||||
* @param {object | string} customStyle 需要转换的目标
|
||||
* @param {String} target 转换的目的，object-转为对象，string-转为字符串
|
||||
* @returns {object|string}
|
||||
*/
|
||||
function addStyle(customStyle, target = 'object') {
|
||||
// 字符串转字符串，对象转对象情形，直接返回
|
||||
@@ -153,14 +170,22 @@ function addStyle(customStyle, target = 'object') {
|
||||
return trim(string)
|
||||
}
|
||||
|
||||
// 添加单位，如果有rpx，upx，%，px等单位结尾或者值为auto，直接返回，否则加上px单位结尾
|
||||
function addUnit(value = 'auto', unit = uni?.$u?.config?.unit ?? 'px') {
|
||||
/**
|
||||
* @description 添加单位，如果有rpx，upx，%，px等单位结尾或者值为auto，直接返回，否则加上px单位结尾
|
||||
* @param {string|number} value 需要添加单位的值
|
||||
* @param {string} unit 添加的单位名 比如px
|
||||
*/
|
||||
function addUnit(value = 'auto', unit = 'px') {
|
||||
value = String(value)
|
||||
// 用uView内置验证规则中的number判断是否为数值
|
||||
return test.number(value) ? `${value}${unit}` : value
|
||||
}
|
||||
|
||||
// 深度克隆
|
||||
/**
|
||||
* @description 深度克隆
|
||||
* @param {object} obj 需要深度克隆的对象
|
||||
* @returns {*} 克隆后的对象或者原值（不是对象）
|
||||
*/
|
||||
function deepClone(obj) {
|
||||
// 对常见的“非”值，直接返回原来值
|
||||
if ([null, undefined, NaN, false].includes(obj)) return obj
|
||||
@@ -177,7 +202,12 @@ function deepClone(obj) {
|
||||
return o
|
||||
}
|
||||
|
||||
// JS对象深度合并
|
||||
/**
|
||||
* @description JS对象深度合并
|
||||
* @param {object} target 需要拷贝的对象
|
||||
* @param {object} source 拷贝的来源对象
|
||||
* @returns {object|boolean} 深度合并后的对象或者false（入参有不是对象）
|
||||
*/
|
||||
function deepMerge(target = {}, source = {}) {
|
||||
target = deepClone(target)
|
||||
if (typeof target !== 'object' || typeof source !== 'object') return false
|
||||
@@ -200,6 +230,10 @@ function deepMerge(target = {}, source = {}) {
|
||||
return target
|
||||
}
|
||||
|
||||
/**
|
||||
* @description error提示
|
||||
* @param {*} err 错误内容
|
||||
*/
|
||||
function error(err) {
|
||||
// 开发环境才提示，生产环境不会提示
|
||||
if (process.env.NODE_ENV === 'development') {
|
||||
@@ -207,7 +241,11 @@ function error(err) {
|
||||
}
|
||||
}
|
||||
|
||||
// 打乱数组
|
||||
/**
|
||||
* @description 打乱数组
|
||||
* @param {array} array 需要打乱的数组
|
||||
* @returns {array} 打乱后的数组
|
||||
*/
|
||||
function randomArray(array = []) {
|
||||
// 原理是sort排序,Math.random()产生0<= x < 1之间的数,会导致x-0.05大于或者小于0
|
||||
return array.sort(() => Math.random() - 0.5)
|
||||
@@ -239,8 +277,12 @@ if (!String.prototype.padStart) {
|
||||
}
|
||||
}
|
||||
|
||||
// 其他更多是格式化有如下:
|
||||
// yyyy:mm:dd|yyyy:mm|yyyy年mm月dd日|yyyy年mm月dd日 hh时MM分等,可自定义组合
|
||||
/**
|
||||
* @description 格式化时间
|
||||
* @param {String|Number} dateTime 需要格式化的时间戳
|
||||
* @param {String} fmt 格式化规则 yyyy:mm:dd|yyyy:mm|yyyy年mm月dd日|yyyy年mm月dd日 hh时MM分等,可自定义组合 默认yyyy-mm-dd
|
||||
* @returns {string} 返回格式化后的字符串
|
||||
*/
|
||||
function timeFormat(dateTime = null, fmt = 'yyyy-mm-dd') {
|
||||
// 如果为null,则格式化当前时间
|
||||
if (!dateTime) dateTime = Number(new Date())
|
||||
@@ -267,10 +309,12 @@ function timeFormat(dateTime = null, fmt = 'yyyy-mm-dd') {
|
||||
}
|
||||
|
||||
/**
|
||||
* 时间戳转为多久之前
|
||||
* @param String timestamp 时间戳
|
||||
* @param String | Boolean format 如果为时间格式字符串，超出一定时间范围，返回固定的时间格式；
|
||||
* @description 时间戳转为多久之前
|
||||
* @param {String|Number} timestamp 时间戳
|
||||
* @param {String|Boolean} format
|
||||
* 格式化规则如果为时间格式字符串，超出一定时间范围，返回固定的时间格式；
|
||||
* 如果为布尔值false，无论什么时间，都返回多久以前的格式
|
||||
* @returns {string} 转化后的内容
|
||||
*/
|
||||
function timeFrom(timestamp = null, format = 'yyyy-mm-dd') {
|
||||
if (timestamp == null) timestamp = Number(new Date())
|
||||
@@ -310,7 +354,9 @@ function timeFrom(timestamp = null, format = 'yyyy-mm-dd') {
|
||||
}
|
||||
|
||||
/**
|
||||
* 去除空格
|
||||
* @description 去除空格
|
||||
* @param String str 需要去除空格的字符串
|
||||
* @param String pos both(左右)|left|right|all 默认both
|
||||
*/
|
||||
function trim(str, pos = 'both') {
|
||||
str = String(str)
|
||||
@@ -327,9 +373,10 @@ function trim(str, pos = 'both') {
|
||||
}
|
||||
|
||||
/**
|
||||
* 对象转url参数
|
||||
* @param {*} data,对象
|
||||
* @param {*} isPrefix,是否自动加上"?"
|
||||
* @description 对象转url参数
|
||||
* @param {object} data,对象
|
||||
* @param {Boolean} isPrefix,是否自动加上"?"
|
||||
* @param {string} arrayFormat 规则 indices|brackets|repeat|comma
|
||||
*/
|
||||
function queryParams(data = {}, isPrefix = true, arrayFormat = 'brackets') {
|
||||
const prefix = isPrefix ? '?' : ''
|
||||
@@ -383,6 +430,11 @@ function queryParams(data = {}, isPrefix = true, arrayFormat = 'brackets') {
|
||||
return _result.length ? prefix + _result.join('&') : ''
|
||||
}
|
||||
|
||||
/**
|
||||
* 显示消息提示框
|
||||
* @param {String} title 提示的内容，长度与 icon 取值有关。
|
||||
* @param {Number} duration 提示的延迟时间，单位毫秒，默认：2000
|
||||
*/
|
||||
function toast(title, duration = 2000) {
|
||||
uni.showToast({
|
||||
title: String(title),
|
||||
@@ -392,9 +444,9 @@ function toast(title, duration = 2000) {
|
||||
}
|
||||
|
||||
/**
|
||||
* 根据主题type值,获取对应的图标
|
||||
* @param String type 主题名称,primary|info|error|warning|success
|
||||
* @param String fill 是否使用fill填充实体的图标
|
||||
* @description 根据主题type值,获取对应的图标
|
||||
* @param {String} type 主题名称,primary|info|error|warning|success
|
||||
* @param {boolean} fill 是否使用fill填充实体的图标
|
||||
*/
|
||||
function type2icon(type = 'success', fill = false) {
|
||||
// 如果非预置值,默认为success
|
||||
@@ -425,13 +477,14 @@ function type2icon(type = 'success', fill = false) {
|
||||
return iconName
|
||||
}
|
||||
|
||||
/*
|
||||
* 参数说明：
|
||||
* number：要格式化的数字
|
||||
* decimals：保留几位小数
|
||||
* decimalPoint：小数点符号
|
||||
* thousandsSeparator：千分位符号
|
||||
* */
|
||||
/**
|
||||
* @description 数字格式化
|
||||
* @param {number|string} number 要格式化的数字
|
||||
* @param {number} decimals 保留几位小数
|
||||
* @param {string} decimalPoint 小数点符号
|
||||
* @param {string} thousandsSeparator 千分位符号
|
||||
* @returns {string} 格式化后的数字
|
||||
*/
|
||||
function priceFormat(number, decimals = 0, decimalPoint = '.', thousandsSeparator = ',') {
|
||||
number = (`${number}`).replace(/[^0-9+-Ee.]/g, '')
|
||||
const n = !isFinite(+number) ? 0 : +number
|
||||
@@ -457,8 +510,14 @@ function priceFormat(number, decimals = 0, decimalPoint = '.', thousandsSeparato
|
||||
return s.join(dec)
|
||||
}
|
||||
|
||||
// 获取duration值，如果带有ms或者s直接返回，如果大于一定值，认为是ms单位，小于一定值，认为是s单位
|
||||
// 比如以30位阈值，那么300大于30，可以理解为用户想要的是300ms，而不是想花300s去执行一个动画
|
||||
/**
|
||||
* @description 获取duration值
|
||||
* 如果带有ms或者s直接返回，如果大于一定值，认为是ms单位，小于一定值，认为是s单位
|
||||
* 比如以30位阈值，那么300大于30，可以理解为用户想要的是300ms，而不是想花300s去执行一个动画
|
||||
* @param {String|number} value 比如: "1s"|"100ms"|1|100
|
||||
* @param {boolean} unit 提示: 如果是false 默认返回number
|
||||
* @return {string|number}
|
||||
*/
|
||||
function getDuration(value, unit = true) {
|
||||
const valueNum = parseInt(value)
|
||||
if (unit) {
|
||||
@@ -470,12 +529,19 @@ function getDuration(value, unit = true) {
|
||||
return valueNum
|
||||
}
|
||||
|
||||
// 日期的月或日补零操作
|
||||
/**
|
||||
* @description 日期的月或日补零操作
|
||||
* @param {String} value 需要补零的值
|
||||
*/
|
||||
function padZero(value) {
|
||||
return `00${value}`.slice(-2)
|
||||
}
|
||||
|
||||
// 在u-form的子组件内容发生变化，或者失去焦点时，尝试通知u-form执行校验方法
|
||||
/**
|
||||
* @description 在u-form的子组件内容发生变化，或者失去焦点时，尝试通知u-form执行校验方法
|
||||
* @param {*} instance
|
||||
* @param {*} event
|
||||
*/
|
||||
function formValidate(instance, event) {
|
||||
const formItem = uni.$u.$parent.call(instance, 'u-form-item')
|
||||
const form = uni.$u.$parent.call(instance, 'u-form')
|
||||
@@ -486,7 +552,12 @@ function formValidate(instance, event) {
|
||||
}
|
||||
}
|
||||
|
||||
// 获取某个对象下的属性，用于通过类似'a.b.c'的形式去获取一个对象的的属性的形式
|
||||
/**
|
||||
* @description 获取某个对象下的属性，用于通过类似'a.b.c'的形式去获取一个对象的的属性的形式
|
||||
* @param {object} obj 对象
|
||||
* @param {string} key 需要获取的属性字段
|
||||
* @returns {*}
|
||||
*/
|
||||
function getProperty(obj, key) {
|
||||
if (!obj) {
|
||||
return
|
||||
@@ -507,7 +578,12 @@ function getProperty(obj, key) {
|
||||
return obj[key]
|
||||
}
|
||||
|
||||
// 设置对象的属性值，如果'a.b.c'的形式进行设置
|
||||
/**
|
||||
* @description 设置对象的属性值，如果'a.b.c'的形式进行设置
|
||||
* @param {object} obj 对象
|
||||
* @param {string} key 需要设置的属性
|
||||
* @param {string} value 设置的值
|
||||
*/
|
||||
function setProperty(obj, key, value) {
|
||||
if (!obj) {
|
||||
return
|
||||
@@ -541,7 +617,9 @@ function setProperty(obj, key, value) {
|
||||
}
|
||||
}
|
||||
|
||||
// 获取当前页面路径
|
||||
/**
|
||||
* @description 获取当前页面路径
|
||||
*/
|
||||
function page() {
|
||||
const pages = getCurrentPages()
|
||||
return `/${getCurrentPages()[pages.length - 1].route}`
|
||||
@@ -575,4 +653,4 @@ export default {
|
||||
getProperty,
|
||||
setProperty,
|
||||
page
|
||||
}
|
||||
}
|
||||
@@ -2,7 +2,7 @@
|
||||
"id": "uview-ui",
|
||||
"name": "uview-ui",
|
||||
"displayName": "uView2.0重磅发布，利剑出鞘，一统江湖",
|
||||
"version": "2.0.13",
|
||||
"version": "2.0.15",
|
||||
"description": "uView UI已完美兼容nvue，全面的组件和便捷的工具会让您信手拈来，如鱼得水",
|
||||
"keywords": [
|
||||
"uview",
|
||||
|
||||
Reference in New Issue
Block a user