Skip to content

Commit 0da59ed

Browse files
wlxuquwlxuqu
committed
1. 优化count-donw倒计时组件，避免多个组件同时使用可能会出现串扰的情况
2. swiper组件新增current参数，可以初始化时指定激活项的索引 3. upload组件新增index参数，在每个回调事件的最后一个参数中返回，用于区别当前的回调属于第几个upload组件产生 4. 修复row组件在QQ小程序上的兼容性 5. 修复演示项目中，无法切换rate组件演示选择数量，以及微信演示中，timeFrom函数显示异常的问题
1 parent ffa959a commit 0da59ed

File tree

13 files changed

+100
-64
lines changed

13 files changed

+100
-64
lines changed

‎manifest.json

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -109,6 +109,12 @@
109109
"usingComponents" : true,
110110
"component2" : true
111111
},
112+
"mp-qq" : {
113+
"optimization" : {
114+
"subPackages" : true
115+
},
116+
"appid" : "15646153"
117+
},
112118
"mp-baidu" : {
113119
"usingComponents" : true,
114120
"appid" : "17597421"

‎pages.json

Lines changed: 14 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -2,14 +2,14 @@
22
"easycom": {
33
"^u-(.*)": "@/uview-ui/components/u-$1/u-$1.vue"
44
},
5-
"condition": { //模式配置，仅开发期间生效
6-
"current": 0, //当前激活的模式(list 的索引项)
7-
"list": [{
8-
"name": "test", //模式名称
9-
"path": "pages/componentsC/test/index", //启动页面，必选
10-
"query": "id=1&name=2" //启动参数，在页面的onLoad函数里面得到
11-
}]
12-
},
5+
// "condition": { //模式配置，仅开发期间生效
6+
// "current": 0, //当前激活的模式(list 的索引项)
7+
// "list": [{
8+
// "name": "test", //模式名称
9+
// "path": "pages/componentsC/layout/index", //启动页面，必选
10+
// "query": "id=1&name=2" //启动参数，在页面的onLoad函数里面得到
11+
// }]
12+
// },
1313
"pages": [
1414
// 演示-组件
1515
{
@@ -835,22 +835,22 @@
835835
"backgroundColor": "#FFFFFF",
836836
"borderStyle": "black",
837837
"list": [{
838-
"pagePath": "pages/example/components"
838+
"pagePath": "pages/example/components",
839839
// "iconPath": "static/uview/example/component.png",
840840
// "selectedIconPath": "static/uview/example/component_select.png",
841-
// "text": "组件"
841+
"text": "组件"
842842
},
843843
{
844-
"pagePath": "pages/example/js"
844+
"pagePath": "pages/example/js",
845845
// "iconPath": "static/uview/example/js.png",
846846
// "selectedIconPath": "static/uview/example/js_select.png",
847-
// "text": "工具"
847+
"text": "工具"
848848
},
849849
{
850-
"pagePath": "pages/example/template"
850+
"pagePath": "pages/example/template",
851851
// "iconPath": "static/uview/example/template.png",
852852
// "selectedIconPath": "static/uview/example/template_select.png",
853-
// "text": "模板"
853+
"text": "模板"
854854
}
855855
]
856856
}

‎pages/componentsB/rate/index.vue

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -73,7 +73,7 @@
7373
},
7474
methods: {
7575
currentChange(index) {
76-
this.current = index == 0 ? 1 : index == 1 ? 2 : index == 2 ? 3 : 4;
76+
this.value = index == 0 ? 1 : index == 1 ? 2 : index == 2 ? 3 : 4;
7777
},
7878
plainChange(index) {
7979
this.plain = !index;

‎pages/componentsC/layout/index.vue

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -34,10 +34,12 @@
3434
<view class="u-item-title">分栏偏移</view>
3535
<u-subsection vibrateShort :list="[0, 1, 2, 3]" @change="offsetChange"></u-subsection>
3636
</view>
37+
<!-- #ifndef MP -->
3738
<view class="u-config-item">
3839
<view class="u-item-title">水平排列方式(微信小程序无效)</view>
3940
<u-subsection vibrateShort :list="['start', 'end', 'around', 'between']" @change="justifyChange"></u-subsection>
4041
</view>
42+
<!-- #endif -->
4143
</view>
4244
</view>
4345
</template>

‎pages/library/timeFrom/index.vue

Lines changed: 10 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -29,25 +29,24 @@
2929
<script>
3030
export default {
3131
data() {
32+
// 微信小程序无法动态修改u-subsection的list参数，导致onLoad中赋值timeArr1，timeArr2无效，故在data中直接赋值
33+
let nowTime = Number(+ new Date());
34+
let threeDayAgo = nowTime - 2 * 86400000;
35+
let arr1 = [0, 0], arr2 = [0, 0];
36+
[0, 0].map((val, index) => {
37+
arr1[index] = this.$u.timeFormat(this.$u.random(threeDayAgo, nowTime), 'yyyy/mm/dd hh:MM:ss');
38+
arr2[index] = this.$u.timeFormat(this.$u.random(threeDayAgo, nowTime), 'yyyy/mm/dd hh:MM:ss');
39+
})
3240
return {
33-
timeArr1: [0, 0],
34-
timeArr2: [0, 0],
41+
timeArr1: arr1,
42+
timeArr2: arr2,
3543
result: null
3644
}
3745
},
3846
onLoad() {
39-
this.getRandomTime();
4047
this.timeArr1Change(0);
4148
},
4249
methods: {
43-
getRandomTime() {
44-
let nowTime = Number(+ new Date());
45-
let threeDayAgo = nowTime - 2 * 86400000;
46-
this.timeArr1.map((val, index) => {
47-
this.timeArr1[index] = this.$u.timeFormat(this.$u.random(threeDayAgo, nowTime), 'yyyy/mm/dd hh:MM:ss');
48-
this.timeArr2[index] = this.$u.timeFormat(this.$u.random(threeDayAgo, nowTime), 'yyyy/mm/dd hh:MM:ss');
49-
})
50-
},
5150
timeArr1Change(index) {
5251
this.result = this.$u.timeFrom((new Date(this.timeArr1[index])).getTime());
5352
},

‎uview-ui/components/u-col/u-col.vue

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -76,7 +76,7 @@
7676
<style lang="scss">
7777
@import "../../libs/css/style.components.scss";
7878
.u-col {
79-
/* #ifdef MP-WEIXIN */
79+
/* #ifdef MP-WEIXIN || MP-QQ */
8080
float: left;
8181
/* #endif */
8282
}

‎uview-ui/components/u-count-down/u-count-down.vue

Lines changed: 12 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -164,7 +164,7 @@ export default {
164164
// 监听时间戳的变化
165165
timestamp(newVal, oldVal) {
166166
// 如果倒计时间发生变化，清除定时器，重新开始倒计时
167-
clearInterval(this.timer);
167+
this.clearTimer();
168168
this.start();
169169
}
170170
},
@@ -211,6 +211,8 @@ export default {
211211
methods: {
212212
// 倒计时
213213
start() {
214+
// 避免可能出现的倒计时重叠情况
215+
this.clearTimer();
214216
if (this.timestamp <= 0) return;
215217
this.seconds = Number(this.timestamp);
216218
this.formatTime(this.seconds);
@@ -254,10 +256,16 @@ export default {
254256
},
255257
// 停止倒计时
256258
end() {
257-
// 清除定时器
258-
clearInterval(this.timer);
259-
this.timer = null;
259+
this.clearTimer();
260260
this.$emit('end', {});
261+
},
262+
// 清除定时器
263+
clearTimer() {
264+
if(this.timer) {
265+
// 清除定时器
266+
clearInterval(this.timer);
267+
this.timer = null;
268+
}
261269
}
262270
},
263271
beforeDestroy() {

‎uview-ui/components/u-rate/u-rate.vue

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@
55
:name="activeIndex > index ? activeIcon : inactiveIcon"
66
@click="click(index + 1, $event)"
77
:color="activeIndex > index ? activeColor : inactiveColor"
8-
:style="{
8+
:custom-style="{
99
fontSize: size + 'rpx',
1010
padding: `0 ${gutter / 2 + 'rpx'}`
1111
}"

‎uview-ui/components/u-row/u-row.vue

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -68,14 +68,14 @@
6868
6969
.u-row {
7070
// 由于微信小程序编译后奇怪的页面结构，只能使用float布局实现，flex无法实现
71-
/* #ifndef MP-WEIXIN */
71+
/* #ifndef MP-WEIXIN || MP-QQ */
7272
display: flex;
7373
/* #endif */
7474
flex-wrap: wrap;
7575
}
7676
7777
.u-row:after {
78-
/* #ifdef MP-WEIXIN */
78+
/* #ifdef MP-WEIXIN || MP-QQ */
7979
display: table;
8080
clear: both;
8181
content: "";

‎uview-ui/components/u-swiper/u-swiper.vue

Lines changed: 28 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -2,16 +2,16 @@
22
<view class="u-swiper-wrap" :style="{
33
borderRadius: `${borderRadius}rpx`
44
}">
5-
<swiper @change="change" @animationfinish="animationfinish" :interval="interval" :circular="circular" :duration="duration" :autoplay="autoplay"
5+
<swiper :current="elCurrent" @change="change" @animationfinish="animationfinish" :interval="interval" :circular="circular" :duration="duration" :autoplay="autoplay"
66
:previous-margin="effect3d ? effect3dPreviousMargin + 'rpx' : '0'" :next-margin="effect3d ? effect3dPreviousMargin + 'rpx' : '0'"
77
:style="{
88
height: height + 'rpx'
99
}">
1010
<swiper-item class="u-swiper-item" v-for="(item, index) in list" :key="index">
11-
<view class="u-list-image-wrap" @tap.stop.prevent="listClick(index)" :class="[current != index ? 'u-list-scale' : '']" :style="{
11+
<view class="u-list-image-wrap" @tap.stop.prevent="listClick(index)" :class="[uCurrent != index ? 'u-list-scale' : '']" :style="{
1212
borderRadius: `${borderRadius}rpx`,
13-
transform: effect3d && current != index ? 'scaleY(0.9)' : 'scaleY(1)',
14-
margin: effect3d && current != index ? '0 20rpx' : 0,
13+
transform: effect3d && uCurrent != index ? 'scaleY(0.9)' : 'scaleY(1)',
14+
margin: effect3d && uCurrent != index ? '0 20rpx' : 0,
1515
backgroundColor: bgColor
1616
}">
1717
<image class="u-swiper-image" :src="item[name]" :mode="imgMode"></image>
@@ -30,19 +30,19 @@
3030
padding: `0 ${effect3d ? '74rpx' : '24rpx'}`
3131
}">
3232
<block v-if="mode == 'rect'">
33-
<view class="u-indicator-item-rect" :class="{ 'u-indicator-item-rect-active': index == current }" v-for="(item, index) in list"
33+
<view class="u-indicator-item-rect" :class="{ 'u-indicator-item-rect-active': index == uCurrent }" v-for="(item, index) in list"
3434
:key="index"></view>
3535
</block>
3636
<block v-if="mode == 'dot'">
37-
<view class="u-indicator-item-dot" :class="{ 'u-indicator-item-dot-active': index == current }" v-for="(item, index) in list"
37+
<view class="u-indicator-item-dot" :class="{ 'u-indicator-item-dot-active': index == uCurrent }" v-for="(item, index) in list"
3838
:key="index"></view>
3939
</block>
4040
<block v-if="mode == 'round'">
41-
<view class="u-indicator-item-round" :class="{ 'u-indicator-item-round-active': index == current }" v-for="(item, index) in list"
41+
<view class="u-indicator-item-round" :class="{ 'u-indicator-item-round-active': index == uCurrent }" v-for="(item, index) in list"
4242
:key="index"></view>
4343
</block>
4444
<block v-if="mode == 'number'">
45-
<view class="u-indicator-item-number">{{ current + 1 }}/{{ list.length }}</view>
45+
<view class="u-indicator-item-number">{{ uCurrent + 1 }}/{{ list.length }}</view>
4646
</block>
4747
</view>
4848
</view>
@@ -156,17 +156,27 @@
156156
bgColor: {
157157
type: String,
158158
default: '#f3f4f6'
159+
},
160+
// 初始化时，默认显示第几项
161+
current: {
162+
type: [Number, String],
163+
default: 0
159164
}
160165
},
161166
watch: {
162-
// 如果外部的list发生变化，判断长度是否被修改，如果前后长度不一致，重置current值，避免溢出
167+
// 如果外部的list发生变化，判断长度是否被修改，如果前后长度不一致，重置uCurrent值，避免溢出
163168
list(nVal, oVal) {
164-
if(nVal.length !== oVal.length) this.current = 0;
169+
if(nVal.length !== oVal.length) this.uCurrent = 0;
170+
},
171+
// 监听外部current的变化，实时修改内部依赖于此测uCurrent值，如果更新了current，而不是更新uCurrent，
172+
// 就会错乱，因为指示器是依赖于uCurrent的
173+
current(n) {
174+
this.uCurrent = n;
165175
}
166176
},
167177
data() {
168178
return {
169-
current: 0 // 当前活跃的swiper-item的index
179+
uCurrent: this.current // 当前活跃的swiper-item的index
170180
};
171181
},
172182
computed: {
@@ -186,6 +196,10 @@
186196
tmp = '12rpx';
187197
}
188198
return tmp;
199+
},
200+
// 因为uni的swiper组件的current参数只接受Number类型，这里做一个转换
201+
elCurrent() {
202+
return Number(this.current);
189203
}
190204
},
191205
methods: {
@@ -194,15 +208,15 @@
194208
},
195209
change(e) {
196210
let current = e.detail.current;
197-
this.current = current;
211+
this.uCurrent = current;
198212
// 发出change事件，表示当前自动切换的index，从0开始
199213
this.$emit('change', current);
200214
},
201215
// 头条小程序不支持animationfinish事件，改由change事件
202-
// 暂不监听此事件，因为不再给swiper绑定current属性
216+
// 暂不监听此事件，因为不再给swiper绑定uCurrent属性
203217
animationfinish(e) {
204218
// #ifndef MP-TOUTIAO
205-
// this.current = e.detail.current;
219+
// this.uCurrent = e.detail.current;
206220
// #endif
207221
}
208222
}

0 commit comments

Comments
 (0)