Skip to content

U
uview-ui
Commit 788462b0 authored by wlxuqu's avatar wlxuqu
Browse files
Options

1. 修复http请求中拦截器中返回false报错的问题 

2. avatar头像新增性别和等级展示角标
3. sticky新增unfixed取消吸顶事件
4. action-sheet组件新增disabled属性，用于禁止某些条目的可选性
5. 最新版hx2.8.2中，waterfall组件支持支付宝小程序
6. button组件返回的click事件中新增返回事件源参数
7. 修复layout的col子组件text-align参数无效的问题
8. icon组件新增用于控制图标的width和height参数，以及控制垂直方向偏移的投票参数
9. 修复image组件的error-icon和loadingicon参数图片时无效的问题
10. input组件新增selection-start和selection-end参数
parent 9d07eb46
Expand all Show whitespace changes
Inline Side-by-side
Showing with 430 additions and 152 deletions
pages.json
View file @ 788462b0
......@@ -2,14 +2,14 @@
"easycom": {
"^u-(.*)": "@/uview-ui/components/u-$1/u-$1.vue"
},
// "condition": { //模式配置，仅开发期间生效
// "current": 0, //当前激活的模式(list 的索引项)
// "list": [{
// "name": "test", //模式名称
// "path": "pages/componentsB/table/index", //启动页面，必选
// "query": "id=1&name=2" //启动参数，在页面的onLoad函数里面得到
// }]
// },
"condition": { //模式配置，仅开发期间生效
"current": 0, //当前激活的模式(list 的索引项)
"list": [{
"name": "test", //模式名称
"path": "pages/componentsA/avatar/index", //启动页面，必选
"query": "id=1&name=2" //启动参数，在页面的onLoad函数里面得到
}]
},
"pages": [
// 演示-组件
{
......
pages/componentsA/avatar/index.vue
View file @ 788462b0
......@@ -3,8 +3,16 @@
<view class="u-demo-wrap">
<view class="u-demo-title">演示效果</view>
<view class="u-demo-area">
<u-avatar :mode="mode" :size="size" :src="src" :text="text">
</u-avatar>
<u-avatar
:mode="mode"
:size="size"
:src="src"
:text="text"
:showLevel="showLevel"
:showSex="showSex"
:sexIcon="sexIcon"
:bgColor='bgColor'
></u-avatar>
</view>
</view>
<view class="u-config-wrap">
......@@ -15,9 +23,17 @@
<view class="u-item-title">模式选择</view>
<u-subsection vibrateShort :list="['圆形', '圆角方形']" @change="modeChange"></u-subsection>
</view>
<view class="u-config-item">
<view class="u-item-title">性别选择</view>
<u-subsection vibrateShort :list="['男', '女', '不显示']" @change="sexChange"></u-subsection>
</view>
<view class="u-config-item">
<view class="u-item-title">等级</view>
<u-subsection vibrateShort :list="['显示', '不显示']" @change="levelChange"></u-subsection>
</view>
<view class="u-config-item">
<view class="u-item-title">自定义内容</view>
<u-subsection vibrateShort current="1" :list="['默认', '图片', '文字']" @change="styleChange"></u-subsection>
<u-subsection vibrateShort current="0" :list="['图片', '文字']" @change="styleChange"></u-subsection>
</view>
<view class="u-config-item">
<view class="u-item-title">尺寸</view>
......@@ -34,7 +50,11 @@
mode: 'circle',
src: 'http://pic2.sc.chinaz.com/Files/pic/pic9/202002/hpic2119_s.jpg',
text: '', // 优先级比src高
size: '90'
size: '90',
showLevel: true,
showSex: true,
sexIcon: 'man',
bgColor: '#fcbd71'
}
},
methods: {
......@@ -43,9 +63,6 @@
},
styleChange(index) {
if(index == 0) {
this.src = '';
this.text = '';
} else if(index == 1) {
this.text = '';
this.src = 'http://pic2.sc.chinaz.com/Files/pic/pic9/202002/hpic2119_s.jpg';
} else {
......@@ -54,8 +71,16 @@
},
sizeChange(index) {
this.size = index == 0 ? 'large' : index == 1 ? 'default' : index == 2 ? 'mini' : 160;
},
sexChange(index) {
this.showSex = true;
if(index == 0) this.sexIcon = 'man';
if(index == 1) this.sexIcon = 'woman';
if(index == 2) this.showSex = false;
},
levelChange(index) {
this.showLevel = !index;
}
}
}
</script>
......
pages/componentsB/sticky/index.vue
View file @ 788462b0
......@@ -4,7 +4,7 @@
<view class="u-demo-title">演示效果</view>
<view class="u-demo-area">
<u-toast ref="uToast"></u-toast>
<u-sticky :offset-top="offsetTop" :enable="enable" @fixed="fixed">
<u-sticky :offset-top="offsetTop" :enable="enable" @fixed="fixed" @unfixed="unfixed">
<view class="sticky">
宝剑锋从磨砺出,梅花香自苦寒来
</view>
......@@ -51,6 +51,12 @@
type: 'warning',
title: '触发吸顶'
})
},
unfixed() {
this.$refs.uToast.show({
type: 'success',
title: '取消吸顶'
})
}
}
}
......
pages/componentsB/waterfall/index.vue
View file @ 788462b0
......@@ -18,7 +18,9 @@
</view>
<view class="demo-shop">{{ item.shop }}</view>
<!-- 微信小程序无效，因为它不支持在template中引入组件 -->
<u-icon name="close-circle-fill" color="#fa3534" size="34" class="u-close" @click="remove(item.id)"></u-icon>
<view class="u-close">
<u-icon name="close-circle-fill" color="#fa3534" size="34" @click="remove(item.id)"></u-icon>
</view>
</view>
</template>
<template v-slot:right="{ rightList }">
......@@ -37,7 +39,9 @@
</view>
<view class="demo-shop">{{ item.shop }}</view>
<!-- 微信小程序无效，因为它不支持在template中引入组件 -->
<u-icon name="close-circle-fill" color="#fa3534" size="34" class="u-close" @click="remove(item.id)"></u-icon>
<view class="u-close">
<u-icon name="close-circle-fill" color="#fa3534" size="34" @click="remove(item.id)"></u-icon>
</view>
</view>
</template>
</u-waterfall>
......
pages/componentsC/actionSheet/index.vue
View file @ 788462b0
......@@ -32,7 +32,8 @@
list: [{
text: '最是人间留不住',
}, {
text: '朱颜辞镜花辞树'
text: '朱颜辞镜花辞树',
disabled: true
}, {
text: '正是江南好风景'
}, {
......
pages/componentsC/test/index.vue
View file @ 788462b0
<template>
<view class="u-content">
<u-dropdown-list></u-dropdown-list>
<view>
<u-popup v-model="show" @close="close">
<view>出淤泥而不染，濯清涟而不妖</view>
</u-popup>
<u-button @click="show = true">打开</u-button>
</view>
</template>
......@@ -8,25 +11,13 @@
export default {
data() {
return {
content: `
<p>露从今夜白，月是故乡明</p>
<img src="https://cdn.uviewui.com/uview/swiper/2.jpg" />
`
show: false
}
},
methods: {
close() {
console.log('close');
}
</script>
<style lang="scss" scoped>
.u-content {
margin-top: 100rpx;
color: $u-content-color;
font-size: 32rpx;
line-height: 1.8;
// 标签形式无效
p {
color: $u-tips-color;
}
}
</style>
</script>
\ No newline at end of file
pages/example/components.config.js
View file @ 788462b0
......@@ -198,13 +198,11 @@ export default [{
icon: 'sticky',
title: 'Sticky 吸顶',
},
// #ifndef MP-ALIPAY
{
path: '/pages/componentsB/waterfall/index',
icon: 'waterfall',
title: 'Waterfall 瀑布流',
},
// #endif
{
path: '/pages/componentsB/divider/index',
icon: 'divider',
......
uview-ui/components/u-action-sheet/u-action-sheet.vue
View file @ 788462b0
......@@ -5,8 +5,14 @@
{{tips.text}}
</view>
<block v-for="(item, index) in list" :key="index">
<view @touchmove.stop.prevent @tap="itemClick(index)" :style="[itemStyle(index)]" class="u-action-sheet-item" :class="[index < list.length - 1 ? 'u-border-bottom' : '']"
hover-class="u-hover-class" :hover-stay-time="150">
<view
@touchmove.stop.prevent
@tap="itemClick(index)"
:style="[itemStyle(index)]"
class="u-action-sheet-item"
:class="[index < list.length - 1 ? 'u-border-bottom' : '']"
:hover-stay-time="150"
>
{{item.text}}
</view>
</block>
......@@ -112,6 +118,8 @@
let style = {};
if (this.list[index].color) style.color = this.list[index].color;
if (this.list[index].fontSize) style.fontSize = this.list[index].fontSize + 'rpx';
// 选项被禁用的样式
if (this.list[index].disabled) style.color = '#c0c4cc';
return style;
}
},
......@@ -132,8 +140,10 @@
popupClose() {
this.$emit('input', false);
},
// 点击某一个itemif (!this.show) return;
// 点击某一个item
itemClick(index) {
// disabled的项禁止点击
if(this.list[index].disabled) return;
this.$emit('click', index);
this.$emit('input', false);
}
......
uview-ui/components/u-avatar/u-avatar.vue
View file @ 788462b0
......@@ -3,13 +3,21 @@
<image
@error="loadError"
:style="[imgStyle]"
class="u-avatar-img"
v-if="!text && avatar"
class="u-avatar__img"
v-if="!uText && avatar"
:src="avatar"
:mode="mode"
></image>
<text class="u-line-1" v-else-if="text">{{text}}</text>
<text class="u-line-1" v-else-if="uText" :style="{
fontSize: '38rpx'
}">{{uText}}</text>
<slot v-else></slot>
<view class="u-avatar__sex" v-if="showSex" :class="['u-avatar__sex--' + sexIcon]" :style="[uSexStyle]">
<u-icon :name="sexIcon" size="20"></u-icon>
</view>
<view class="u-avatar__level" v-if="showLevel" :style="[uLevelStyle]">
<u-icon :name="levelIcon" size="20"></u-icon>
</view>
</view>
</template>
......@@ -23,7 +31,12 @@
* @property {String} src 头像路径，如加载失败，将会显示默认头像
* @property {String Number} size 头像尺寸，可以为指定字符串(large, default, mini)，或者数值，单位rpx（默认default）
* @property {String} mode 显示类型，见上方说明（默认circle）
* @property {String} text 用文字替代图片，级别优先于src
* @property {String} sex-icon 性别图标，man-男，woman-女（默认man）
* @property {String} level-icon 等级图标（默认level）
* @property {String} sex-bg-color 性别图标背景颜色
* @property {String} level-bg-color 等级图标背景颜色
* @property {String} show-sex 是否显示性别图标（默认false）
* @property {String} show-level 是否显示等级图标（默认false）
* @property {String} img-mode 头像图片的裁剪类型，与uni的image组件的mode参数一致，如效果达不到需求，可尝试传widthFix值（默认aspectFill）
* @property {String} index 用户传递的标识符值，如果是列表循环，可穿v-for的index值
* @event {Function} click 头像被点击
......@@ -67,6 +80,36 @@
index: {
type: [String, Number],
default: ''
},
// 右上角性别角标，man-男，woman-女
sexIcon: {
type: String,
default: 'man'
},
// 右下角的等级图标
levelIcon: {
type: String,
default: 'level'
},
// 右下角等级图标背景颜色
levelBgColor: {
type: String,
default: ''
},
// 右上角性别图标的背景颜色
sexBgColor: {
type: String,
default: ''
},
// 是否显示性别图标
showSex: {
type: Boolean,
default: false
},
// 是否显示等级图标
showLevel: {
type: Boolean,
default: false
}
},
data() {
......@@ -99,6 +142,22 @@
style.borderRadius = this.mode == 'circle' ? '500px' : '5px';
return style;
},
// 取字符串的第一个字符
uText() {
return String(this.text)[0];
},
// 性别图标的自定义样式
uSexStyle() {
let style = {};
if(this.sexBgColor) style.backgroundColor = this.sexBgColor;
return style;
},
// 等级图标的自定义样式
uLevelStyle() {
let style = {};
if(this.levelBgColor) style.backgroundColor = this.levelBgColor;
return style;
}
},
methods: {
// 图片加载错误时，显示默认头像
......@@ -123,11 +182,54 @@
font-size: 28rpx;
color: $u-content-color;
border-radius: 10px;
overflow: hidden;
}
position: relative;
.u-avatar-img {
&__img {
width: 100%;
height: 100%;
}
&__sex {
position: absolute;
width: 32rpx;
color: #ffffff;
height: 32rpx;
display: flex;
justify-content: center;
align-items: center;
border-radius: 100rpx;
top: 5%;
z-index: 1;
right: -7%;
border: 1px #ffffff solid;
&--man {
background-color: $u-type-primary;
}
&--woman {
background-color: $u-type-error;
}
&--none {
background-color: $u-type-warning;
}
}
&__level {
position: absolute;
width: 32rpx;
color: #ffffff;
height: 32rpx;
display: flex;
justify-content: center;
align-items: center;
border-radius: 100rpx;
bottom: 5%;
z-index: 1;
right: -7%;
border: 1px #ffffff solid;
background-color: $u-type-warning;
}
}
</style>
uview-ui/components/u-button/u-button.vue
View file @ 788462b0
......@@ -66,6 +66,7 @@
* @property {Boolean} loading 按钮名称前是否带 loading 图标(App-nvue 平台，在 ios 上为雪花，Android上为圆圈)
* @property {String} form-type 用于 <form> 组件，点击分别会触发 <form> 组件的 submit/reset 事件
* @property {String} open-type 开放能力
* @property {String} data-name 额外传参参数，用于小程序的data-xxx属性，通过target.dataset.name获取
* @property {String} hover-class 指定按钮按下去的样式类。当 hover-class="none" 时，没有点击态效果(App-nvue 平台暂不支持)
* @property {Number} hover-start-time 按住后多久出现点击态，单位毫秒
* @property {Number} hover-stay-time 手指松开后点击态保留时间，单位毫秒
......@@ -245,7 +246,7 @@ export default {
this.getWaveQuery(e);
});
}
this.$emit('click');
this.$emit('click', e);
},
// 查询按钮的节点信息
getWaveQuery(e) {
......
uview-ui/components/u-col/u-col.vue
View file @ 788462b0
......@@ -7,7 +7,7 @@
flex: `0 0 ${100 / 12 * span}%`,
alignItems: uAlignItem,
justifyContent: uJustify,
textAlign: this.textAlign
textAlign: textAlign
}" @tap.stop.prevent="click">
<slot></slot>
</view>
......
uview-ui/components/u-icon/u-icon.vue
View file @ 788462b0
......@@ -34,6 +34,9 @@
* @property {String} label-pos label相对于图标的位置，只能right或bottom（默认right）
* @property {String} index 一个用于区分多个图标的值，点击图标时通过click事件传出
* @property {String} hover-class 图标按下去的样式类，用法同uni的view组件的hover-class参数，详情见官网
* @property {String} width 显示图片小图标时的宽度
* @property {String} height 显示图片小图标时的高度
* @property {String} top 图标在垂直方向上的定位
* @event {Function} click 点击图标时触发
* @example <u-icon name="photo" color="#2979ff" size="28"></u-icon>
*/
......@@ -127,6 +130,21 @@ export default {
return {}
}
},
// 用于显示图片小图标时，图片的宽度
width: {
type: [String, Number],
default: ''
},
// 用于显示图片小图标时，图片的高度
height: {
type: [String, Number],
default: ''
},
// 用于解决某些情况下，让图标垂直居中的用途
top: {
type: [String, Number],
default: ''
}
},
computed: {
customClass() {
......@@ -148,7 +166,9 @@ export default {
let style = {};
style = {
fontSize: this.size == 'inherit' ? 'inherit' : this.$u.addUnit(this.size),
fontWeight: this.bold ? 'bold' : 'normal'
fontWeight: this.bold ? 'bold' : 'normal',
// 安卓和iOS各需要设置一个到顶部的距离，才能更好的垂直居中
top: this.top === '' ? (this.$u.os == 'ios' ? '2rpx' : '4rpx') : 0
};
// 非主题色值时，才当作颜色值
if (this.color && !this.$u.config.type.includes(this.color)) style.color = this.color;
......@@ -160,8 +180,9 @@ export default {
},
imgStyle() {
let style = {};
style.width = this.$u.addUnit(this.size);
style.height = this.$u.addUnit(this.size);
// 如果设置width和height属性，则优先使用，否则使用size属性
style.width = this.width ? this.$u.addUnit(this.width) : this.$u.addUnit(this.size);
style.height = this.height ? this.$u.addUnit(this.height) : this.$u.addUnit(this.size);
return style;
}
},
......@@ -205,6 +226,8 @@ export default {
}
&__icon {
position: relative;
&--primary {
color: $u-type-primary;
}
......
uview-ui/components/u-image/u-image.vue
View file @ 788462b0
......@@ -21,7 +21,7 @@
}"
>
<slot v-if="$slots.loading" name="loading" />
<u-icon v-else :name="loadingIcon"></u-icon>
<u-icon v-else :name="loadingIcon" :width="width" :height="height"></u-icon>
</view>
<view
v-if="showError && isError && !loading"
......@@ -31,7 +31,7 @@
}"
>
<slot v-if="$slots.error" name="error" />
<u-icon v-else :name="errorIcon"></u-icon>
<u-icon v-else :name="errorIcon" :width="width" :height="height"></u-icon>
</view>
</view>
</template>
......@@ -54,6 +54,8 @@
* @property {Boolean} show-loading 是否显示加载中的图标或者自定义的slot（默认 true）
* @property {Boolean} show-error 是否显示加载错误的图标或者自定义的slot（默认 true）
* @property {Boolean} fade 是否需要淡入效果（默认 true）
* @property {String Number} width 传入图片路径时图片的宽度
* @property {String Number} height 传入图片路径时图片的高度
* @property {Boolean} webp 只支持网络资源，只对微信小程序有效（默认 false）
* @property {String | Number} duration 搭配fade参数的过渡时间，单位ms（默认 500）
* @event {Function} click 点击图片时触发
......@@ -62,6 +64,7 @@
* @example <u-image width="100%" height="300rpx" :src="src"></u-image>
*/
export default {
name: 'u-image',
props: {
// 图片地址
src: {
......
uview-ui/components/u-input/u-input.vue
View file @ 788462b0
......@@ -24,6 +24,8 @@
:fixed="fixed"
:focus="focus"
:autoHeight="autoHeight"
:selection-end="uSelectionEnd"
:selection-start="uSelectionStart"
@input="handleInput"
@blur="handleBlur"
@focus="onFocus"
......@@ -43,6 +45,8 @@
:focus="focus"
:confirmType="confirmType"
:cursor-spacing="getCursorSpacing"
:selection-end="uSelectionEnd"
:selection-start="uSelectionStart"
@focus="onFocus"
@blur="handleBlur"
@input="handleInput"
......@@ -78,6 +82,8 @@ import Emitter from '../../libs/util/emitter.js';
* @property {String} placeholder placeholder显示值(默认 '请输入内容')
* @property {Boolean} disabled 是否禁用输入框(默认false)
* @property {String Number} maxlength 输入框的最大可输入长度(默认140)
* @property {String Number} selection-start 光标起始位置，自动聚焦时有效，需与selection-end搭配使用（默认-1）
* @property {String Number} maxlength 光标结束位置，自动聚焦时有效，需与selection-start搭配使用（默认-1）
* @property {String Number} cursor-spacing 指定光标与键盘的距离，单位px(默认0)
* @property {String} placeholderStyle placeholder的样式，字符串形式，如"color: red;"(默认 "color: #c0c4cc;")
* @property {String} confirm-type 设置键盘右下角按钮的文字，仅在type为text时生效(默认done)
......@@ -184,6 +190,16 @@ export default {
cursorSpacing: {
type: [Number, String],
default: 0
},
// 光标起始位置，自动聚焦时有效，需与selection-end搭配使用
selectionStart: {
type: [Number, String],
default: -1
},
// 光标结束位置，自动聚焦时有效，需与selection-start搭配使用
selectionEnd: {
type: [Number, String],
default: -1
}
},
data() {
......@@ -223,6 +239,14 @@ export default {
//
getCursorSpacing() {
return Number(this.cursorSpacing);
},
// 光标起始位置
uSelectionStart() {
return String(this.selectionStart);
},
// 光标结束位置
uSelectionEnd() {
return String(this.selectionEnd);
}
},
created() {
......
uview-ui/components/u-number-box/u-number-box.vue
View file @ 788462b0
<template>
<view class="u-numberbox">
<view class="u-icon-minus" @touchstart.stop="btnTouchStart('minus')" @touchend.stop="clearTimer" :class="{ 'u-icon-disabled': disabled || inputVal <= min }" :style="{
<view class="u-icon-minus" @touchstart.stop="btnTouchStart('minus')" @touchend.stop="clearTimer" :class="{ 'u-icon-disabled': disabled || inputVal <= min }"
:style="{
background: bgColor,
height: inputHeight + 'rpx',
color: color
}">
<u-icon name="minus" :size="size"></u-icon>
</view>
<input :disabled="disabledInput || disabled" :cursor-spacing="getCursorSpacing" :class="{ 'u-input-disabled': disabled }" v-model="inputVal" class="u-number-input" @blur="onBlur"
<input :disabled="disabledInput || disabled" :cursor-spacing="getCursorSpacing" :class="{ 'u-input-disabled': disabled }"
v-model="inputVal" class="u-number-input" @blur="onBlur"
type="number" :style="{
color: color,
fontSize: size + 'rpx',
......@@ -15,7 +17,8 @@
height: inputHeight + 'rpx',
width: inputWidth + 'rpx'
}" />
<view class="u-icon-plus" @touchstart.stop="btnTouchStart('plus')" @touchend.stop="clearTimer" :class="{ 'u-icon-disabled': disabled || inputVal >= max }" :style="{
<view class="u-icon-plus" @touchstart.stop="btnTouchStart('plus')" @touchend.stop="clearTimer" :class="{ 'u-icon-disabled': disabled || inputVal >= max }"
:style="{
background: bgColor,
height: inputHeight + 'rpx',
color: color
......@@ -37,6 +40,7 @@
* @property {Number} step 步长，每次加或减的值（默认1）
* @property {Boolean} disabled 是否禁用操作，禁用后无法加减或手动修改输入框的值（默认false）
* @property {Boolean} disabled-input 是否禁止输入框手动输入值（默认false）
* @property {Boolean} positive-integer 是否只能输入正整数（默认true）
* @property {String | Number} size 输入框文字和按钮字体大小，单位rpx（默认26）
* @property {String} color 输入框文字和加减按钮图标的颜色（默认#323233）
* @property {String | Number} input-width 输入框宽度，单位rpx（默认80）
......@@ -129,9 +133,21 @@
pressTime: {
type: [Number, String],
default: 250
},
// 是否只能输入大于或等于0的整数(正整数)
positiveInteger: {
type: Boolean,
default: true
}
},
watch: {
value(v1, v2) {
// 只有value的改变是来自外部的时候，才去同步inputVal的值，否则会造成循环错误
if(!this.changeFromInner) {
this.inputVal = v1;
}
this.changeFromInner = false;
},
inputVal(v1, v2) {
// 为了让用户能够删除所有输入值，重新输入内容，删除所有值后，内容为空字符串
if (v1 == '') return;
......@@ -140,14 +156,26 @@
let tmp = this.$u.test.number(v1);
if (tmp && v1 >= this.min && v1 <= this.max) value = v1;
else value = v2;
// 判断是否只能输入大于等于0的整数
if(this.positiveInteger) {
// 小于0，或者带有小数点，
if(v1 < 0 || String(v1).indexOf('.') !== -1) {
value = v2;
// 双向绑定input的值，必须要使用$nextTick修改显示的值
this.$nextTick(() => {
this.inputVal = v2;
})
}
}
// 发出change事件
this.handleChange(value, 'change');
}
},
data() {
return {
inputVal: 1 , // 输入框中的值，不能直接使用props中的value，因为应该改变props的状态
inputVal: 1, // 输入框中的值，不能直接使用props中的value，因为应该改变props的状态
timer: null, // 用作长按的定时器
changeFromInner: false, // 值发生变化，是来自内部还是外部
};
},
created() {
......@@ -165,7 +193,7 @@
// 先执行一遍方法，否则会造成松开手时，就执行了clearTimer，导致无法实现功能
this[callback]();
// 如果没开启长按功能，直接返回
if(!this.longPress) return ;
if (!this.longPress) return;
clearInterval(this.timer); //再次清空定时器，防止重复注册定时器
this.timer = null;
this.timer = setInterval(() => {
......@@ -256,6 +284,7 @@
handleChange(value, type) {
if (this.disabled) return;
// 发出input事件，修改通过v-model绑定的值，达到双向绑定的效果
this.changeFromInner = true;
this.$emit('input', Number(value));
this.$emit(type, {
// 转为Number类型
......
uview-ui/components/u-picker/u-picker.vue
View file @ 788462b0
......@@ -2,7 +2,12 @@
<u-popup :maskCloseAble="maskCloseAble" mode="bottom" :popup="false" v-model="value" length="auto" :safeAreaInsetBottom="safeAreaInsetBottom" @close="close" :z-index="uZIndex">
<view class="u-datetime-picker">
<view class="u-picker-header" @touchmove.stop.prevent="">
<view class="u-btn-picker u-btn-picker--tips" :style="{ color: cancelColor }" hover-class="u-opacity" :hover-stay-time="150" @tap="getResult('cancel')">取消</view>
<view class="u-btn-picker u-btn-picker--tips"
:style="{ color: cancelColor }"
hover-class="u-opacity"
:hover-stay-time="150"
@tap="getResult('cancel')"
>{{cancelText}}</view>
<view class="u-picker__title">{{ title }}</view>
<view
class="u-btn-picker u-btn-picker--primary"
......@@ -12,7 +17,7 @@
@touchmove.stop=""
@tap.stop="getResult('confirm')"
>
确定
{{confirmText}}
</view>
</view>
<view class="u-picker-body">
......@@ -108,6 +113,8 @@ import areas from '../../libs/util/area.js';
* @property {String} cancel-color 取消按钮的颜色（默认#606266）
* @property {String} confirm-color 确认按钮的颜色（默认#2979ff）
* @property {String} default-time 默认选中的时间，mode=time时有效
* @property {String} confirm-text 确认按钮的文字
* @property {String} cancel-text 取消按钮的文字
* @property {String} default-region 默认选中的地区，中文形式，mode=region时有效
* @property {String} default-code 默认选中的地区，编号形式，mode=region时有效
* @property {Boolean} mask-close-able 是否允许通过点击遮罩关闭Picker（默认true）
......@@ -231,6 +238,16 @@ export default {
title: {
type: String,
default: ''
},
// 取消按钮的文字
cancelText: {
type: String,
default: '取消'
},
// 确认按钮的文字
confirmText: {
type: String,
default: '确认'
}
},
data() {
......
uview-ui/components/u-popup/u-popup.vue
View file @ 788462b0
......@@ -33,10 +33,9 @@
<scroll-view class="u-drawer__scroll-view" scroll-y="true" v-else>
<slot />
</scroll-view>
<view class="u-close" :class="['u-close--' + closeIconPos]">
<view @tap="close" class="u-close" :class="['u-close--' + closeIconPos]">
<u-icon
v-if="mode != 'center' && closeable"
@click="close"
:name="closeIcon"
:color="closeIconColor"
:size="closeIconSize"
......@@ -196,6 +195,7 @@ export default {
visibleSync: false,
showDrawer: false,
timer: null,
closeFromInner: false, // value的值改变，是发生在内部还是外部
};
},
computed: {
......@@ -263,9 +263,10 @@ export default {
value(val) {
if (val) {
this.open();
} else {
} else if(!this.closeFromInner) {
this.close();
}
this.closeFromInner = false;
}
},
mounted() {
......@@ -298,7 +299,12 @@ export default {
// 打开时，先渲染组件，延时一定时间再让遮罩和弹窗的动画起作用
change(param1, param2, status) {
// 如果this.popup为false，意味着为picker，actionsheet等组件调用了popup组件
if (this.popup == true) this.$emit('input', status);
if (this.popup == true) {
// 标记关闭是内部发生的，否则修改了value值，导致watch中对value检测，导致再执行一遍close
// 造成@close事件触发两次
this.closeFromInner = true;
this.$emit('input', status);
}
this[param1] = status;
if(status) {
// #ifdef H5 || MP
......
uview-ui/components/u-section/u-section.vue
View file @ 788462b0
......@@ -9,7 +9,7 @@
'u-section--line': showLine
}">
<view class="u-section__title__icon-wrap u-flex" :style="[lineStyle]">
<u-icon name="column-line" :size="fontSize * 1.25" bold :color="lineColor ? lineColor : color"></u-icon>
<u-icon top="0" name="column-line" :size="fontSize * 1.25" bold :color="lineColor ? lineColor : color"></u-icon>
</view>
<text class="u-flex u-section__title__text">{{title}}</text>
</view>
......@@ -94,7 +94,7 @@
return {
// 由于竖线为字体图标，具有比实际线宽更宽的宽度，所以也需要根据字体打下动态调整
left: -(Number(this.fontSize) * 0.9) + 'rpx',
top: -(Number(this.fontSize) * (this.$u.os == 'ios' ? 0.13 : 0.15)) + 'rpx',
top: -(Number(this.fontSize) * (this.$u.os == 'ios' ? 0.14 : 0.15)) + 'rpx',
}
}
},
......
uview-ui/components/u-select/u-select.vue
View file @ 788462b0
......@@ -19,7 +19,7 @@
:hover-stay-time="150"
@tap="getResult('cancel')"
>
取消
{{cancelText}}
</view>
<view class="u-select__header__title">
{{title}}
......@@ -32,7 +32,7 @@
@touchmove.stop=""
@tap.stop="getResult('confirm')"
>
确定
{{confirmText}}
</view>
</view>
<view class="u-select__body">
......@@ -60,6 +60,8 @@
* @property {Boolean} safe-area-inset-bottom 是否开启底部安全区适配(默认false)
* @property {String} cancel-color 取消按钮的颜色（默认#606266）
* @property {String} confirm-color 确认按钮的颜色(默认#2979ff)
* @property {String} confirm-text 确认按钮的文字
* @property {String} cancel-text 取消按钮的文字
* @property {String} default-value 提供的默认选中的下标，见官网说明
* @property {Boolean} mask-close-able 是否允许通过点击遮罩关闭Picker(默认true)
* @property {String Number} z-index 弹出时的z-index值(默认10075)
......@@ -144,6 +146,16 @@ export default {
title: {
type: String,
default: ''
},
// 取消按钮的文字
cancelText: {
type: String,
default: '取消'
},
// 确认按钮的文字
confirmText: {
type: String,
default: '确认'
}
},
data() {
......
uview-ui/components/u-slider/u-slider.vue
View file @ 788462b0
......@@ -18,7 +18,8 @@
<slot v-if="$slots.default"/>
<view v-else class="u-slider__button" :style="[blockStyle, {
height: blockWidth + 'rpx',
width: blockWidth + 'rpx'
width: blockWidth + 'rpx',
backgroundColor: blockColor
}]"></view>
</view>
</view>
......
uview-ui/components/u-sticky/u-sticky.vue
View file @ 788462b0
......@@ -29,6 +29,7 @@
* @property {String Number} z-index 吸顶时的z-index值（默认970）
* @property {String Number} h5-nav-height 导航栏高度，自定义导航栏时(无导航栏时需设置为0)，需要传入此值，单位px（默认44）
* @event {Function} fixed 组件吸顶时触发
* @event {Function} unfixed 组件取消吸顶时触发
* @example <u-sticky offset-top="200"><view>塞下秋来风景异，衡阳雁去无留意</view></u-sticky>
*/
export default {
......@@ -132,8 +133,9 @@
},
setFixed(top) {
const fixed = top < this.stickyTop;
this.fixed = fixed;
if (fixed) this.$emit('fixed', this.index);
else if(this.fixed) this.$emit('unfixed', this.index);
this.fixed = fixed;
},
disconnectObserver(observerName) {
const observer = this[observerName];
......
uview-ui/components/u-tabs/u-tabs.vue
View file @ 788462b0
......@@ -6,7 +6,7 @@
<view :id="id">
<scroll-view scroll-x class="u-scroll-view" :scroll-left="scrollLeft" scroll-with-animation>
<view class="u-scroll-box" :class="{'u-tabs-scorll-flex': !isScroll}">
<view class="u-tab-item" :id="'u-tab-item-' + index" v-for="(item, index) in list" :key="index" @tap="clickTab(index)"
<view class="u-tab-item u-line-1" :id="'u-tab-item-' + index" v-for="(item, index) in list" :key="index" @tap="clickTab(index)"
:style="[tabItemStyle(index)]">
{{ item[name] || item['name']}}
</view>
......@@ -35,6 +35,7 @@
* @property {Object} bar-style 底部滑块的样式，对象形式
* @property {Boolean} show-bar 是否显示底部的滑块（默认true）
* @property {String Number} bar-height 滑块高度，单位rpx（默认6）
* @property {String Number} item-width 标签的宽度（默认auto）
* @property {String Number} gutter 单个tab标签的左右内边距之和，单位rpx（默认40）
* @property {String} bg-color tabs导航栏的背景颜色（默认#ffffff）
* @property {String} name 组件内部读取的list参数中的属性名，见官网说明（默认name）
......@@ -135,6 +136,11 @@
default() {
return {}
}
},
// 标签的宽度
itemWidth: {
type: [Number, String],
default: 'auto'
}
},
data() {
......@@ -196,7 +202,8 @@
'font-size': this.fontSize + 'rpx',
'transition-duration': `${this.duration}s`,
padding: this.isScroll ? `0 ${this.gutter}rpx` : '',
flex: this.isScroll ? 'auto' : '1'
flex: this.isScroll ? 'auto' : '1',
width: this.$u.addUnit(this.itemWidth)
};
// 字体加粗
if (index == this.currentIndex && this.bold) style.fontWeight = 'bold';
......
uview-ui/components/u-upload/u-upload.vue
View file @ 788462b0
......@@ -235,7 +235,7 @@ export default {
limitType:{
type: Array,
default() {
return ['png', 'jpg', 'jpeg', 'webp'];
return ['png', 'jpg', 'jpeg', 'webp', 'gif'];
}
},
},
......
uview-ui/iconfont.css
View file @ 788462b0
This diff is collapsed.
uview-ui/libs/request/index.js
View file @ 788462b0
......@@ -14,11 +14,11 @@ class Request {
let tmpConfig = {};
let interceptorReuest = this.interceptor.request(options);
if (interceptorReuest === false) {
return false;
// 返回一个处于pending状态中的Promise，来取消原promise
return new Promise(()=>{});
}
this.options = interceptorReuest;
}
options.dataType = options.dataType || this.config.dataType;
options.responseType = options.responseType || this.config.responseType;
options.url = options.url || '';
......@@ -91,6 +91,10 @@ class Request {
}, this.config.loadingTime);
}
uni.request(options);
}).catch(res => {
// 如果返回reject()，不让其进入this.$u.post().then().catch()后面的catct()
// 因为很多人都会忘了写后面的catch()，导致报错捕获不到catch
return new Promise(()=>{});
})
}
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment