Skip to content

Commit c1c3e00

Browse files
wlxuquwlxuqu
committed
1.【新增】readMore组件新增index参数和close，open事件
2.【新增】新增man，woman，level三个图标 3.【新增】新增"注意事项"专题，记录一些踩坑知识点，让同学们少走弯路，详见[注意事项](https://uviewui.com/components/feature.html) 4.【新增】alertTips组件新增icon、title-style、desc-style、icon-style参数 5.【新增】新增节流和防抖方法，通过this.$u.debounce()和this.$u.throttle()调用，详见[节流防抖](https://uviewui.com/js/debounce.html) 6.【新增】button组件新增节流功能，以及配置间隔时间的throttle-time参数 7.【新增】field和input组件新增trim参数，默认为true，可以去除输入内容两端的空格 8.【优化】优化form-item组件的label设置为空内容时，依然显示左边的占位的问题 9.【优化】优化lazy-load组件修改图片路径后，无法再次加载的问题 10.【优化】优化navbar，upload，tabbar等组件由于各小程序props参数类型为Function，组件内执行父组件方法时this上下文丢失的问题 11.【优化】优化numberbox组件无法阻止事件冒泡的问题 12.【优化】优化timeFormat组件由于使用es7的padStart方法，导致在电脑版微信小程序无法识别的问题 13.【调整】调整this.$u.sys和this.$u.os，通过this.$u.sys()和this.$u.os()调用，详见[升级指南](https://uviewui.com/components/changeGuide.html) 14.【修复】修复无法通过手动设置popup的v-model为false来关闭popup的问题 15.【修复】修复骨架屏组件在微信小程序平台的组件中使用无效的问题。
1 parent 582557e commit c1c3e00

File tree

36 files changed

+706
-318
lines changed

36 files changed

+706
-318
lines changed

‎README.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,7 @@
99

1010
uView UI，是[uni-app](https://uniapp.dcloud.io/)生态优秀的UI框架，全面的组件和便捷的工具会让您信手拈来，如鱼得水
1111

12-
### **欢迎加群交流反馈：249718512**
12+
### **欢迎加群交流反馈：1129077272**
1313

1414
## 特性
1515

‎manifest.json

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22
"name" : "uView",
33
"appid" : "__UNI__60F4B81",
44
"description" : "多平台快速开发的UI框架",
5-
"versionName" : "1.5.7",
5+
"versionName" : "1.5.8",
66
"versionCode" : "100",
77
"transformPx" : false,
88
"app-plus" : {
@@ -126,6 +126,7 @@
126126
"treeShaking" : {
127127
"enable" : true
128128
}
129-
}
129+
},
130+
"title" : "uView UI"
130131
}
131132
}

‎pages.json

Lines changed: 15 additions & 8 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/componentsA/avatar/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/test/index", //启动页面，必选
10+
// "query": "id=1&name=2" //启动参数，在页面的onLoad函数里面得到
11+
// }]
12+
// },
1313
"pages": [
1414
// 演示-组件
1515
{
@@ -328,6 +328,13 @@
328328
{
329329
"root": "pages/library",
330330
"pages": [
331+
// debounce-节流防抖
332+
{
333+
"path": "debounce/index",
334+
"style": {
335+
"navigationBarTitleText": "throttle | debounce-节流防抖"
336+
}
337+
},
331338
// deepClone-对象深度克隆
332339
{
333340
"path": "deepClone/index",

‎pages/componentsA/navbar/index.vue

Lines changed: 6 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,11 @@
11
<template>
22
<view class="">
3-
<u-navbar title-color="#fff" back-icon-color="#ffffff" :is-fixed="isFixed" :is-back="isBack" :background="background" :back-text-style="{color: '#fff'}" :title="title" :back-icon-name="backIconName" :back-text="backText">
3+
<u-navbar title-color="#fff" back-icon-color="#ffffff"
4+
:is-fixed="isFixed" :is-back="isBack"
5+
:background="background"
6+
:back-text-style="{color: '#fff'}" :title="title"
7+
:back-icon-name="backIconName" :back-text="backText"
8+
>
49
<view class="slot-wrap" v-if="useSlot">
510
<view class="search-wrap" v-if="search">
611
<!-- 如果使用u-search组件，必须要给v-model绑定一个变量 -->

‎pages/componentsB/readMore/index.vue

Lines changed: 7 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@
33
<view class="u-demo-wrap">
44
<view class="u-demo-title">演示效果</view>
55
<view class="u-demo-area">
6-
<u-read-more :toggle="toggle" :show-height="showHeight" ref="uReadMore">
6+
<u-read-more @open="open" @close="close" :toggle="toggle" :show-height="showHeight" ref="uReadMore">
77
<!-- u-parse组件在微信小程序渲染慢，支付宝小程序rich-text不支持nodes属性 -->
88
<!-- #ifdef MP-ALIPAY -->
99
<u-parse :html="content"></u-parse>
@@ -48,6 +48,12 @@
4848
},
4949
toggleChange(index) {
5050
this.toggle = index == 0 ? true : false;
51+
},
52+
open() {
53+
// console.log('open');
54+
},
55+
close() {
56+
// console.log('close');
5157
}
5258
}
5359
}

‎pages/componentsC/section/index.vue

Lines changed: 10 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@
33
<view class="u-demo-wrap">
44
<view class="u-demo-title">演示效果</view>
55
<view class="u-demo-area">
6-
<u-section :title="title" :right="right" :bold="bold" :color="color" :show-line="false"></u-section>
6+
<u-section :title="title" :right="right" :bold="bold" :color="color" :show-line="showLine"></u-section>
77
</view>
88
</view>
99
<view class="u-config-wrap">
@@ -14,6 +14,10 @@
1414
<view class="u-item-title">更换主标题</view>
1515
<u-subsection vibrateShort :current="1" :list="['是', '否']" @change="titleChange"></u-subsection>
1616
</view>
17+
<view class="u-config-item">
18+
<view class="u-item-title">竖条状态</view>
19+
<u-subsection vibrateShort :list="['显示', '隐藏']" @change="showLineChange"></u-subsection>
20+
</view>
1721
<view class="u-config-item">
1822
<view class="u-item-title">是否显示右边部分</view>
1923
<u-subsection vibrateShort :list="['是', '否']" @change="rightChange"></u-subsection>
@@ -37,7 +41,8 @@
3741
title: '红豆生南国',
3842
bold: true,
3943
right: true,
40-
color: this.$u.color['mainColor']
44+
color: this.$u.color['mainColor'],
45+
showLine: true
4146
}
4247
},
4348
methods: {
@@ -53,6 +58,9 @@
5358
},
5459
colorChange(index) {
5560
this.color = index == 0 ? this.$u.color['mainColor'] : this.$u.color['primary'];
61+
},
62+
showLineChange(index) {
63+
this.showLine = !index;
5664
}
5765
}
5866
}

‎pages/componentsC/test/index.vue

Lines changed: 24 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -1,23 +1,39 @@
11
<template>
2-
<view>
3-
<u-popup v-model="show" @close="close">
4-
<view>出淤泥而不染，濯清涟而不妖</view>
5-
</u-popup>
6-
<u-button @click="show = true">打开</u-button>
2+
<view style="padding-top: 200px;">
3+
<u-button @click="show = true" :custom-style="{
4+
color: 'red',
5+
borderColor: 'blue'
6+
}">打开</u-button>
77
</view>
88
</template>
99

1010
<script>
1111
export default {
1212
data() {
1313
return {
14-
show: false
14+
show: true,
15+
list: [{
16+
name: '待收货'
17+
}, {
18+
name: '待付款'
19+
}, {
20+
name: '待评价'
21+
}],
22+
current: 0
1523
}
1624
},
25+
onLoad() {
26+
// setTimeout(() => {
27+
// this.show = false;
28+
// }, 2000)
29+
},
1730
methods: {
1831
close() {
19-
console.log('close');
32+
//console.log('close');
33+
},
34+
change(index) {
35+
this.current = index;
2036
}
2137
}
2238
}
23-
</script>
39+
</script>

‎pages/example/js.config.js

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -22,6 +22,11 @@ export default [
2222
{
2323
groupName: '工具库',
2424
list: [
25+
{
26+
path: 'debounce',
27+
icon: 'debounce',
28+
title: 'throttle | debounce 节流防抖',
29+
},
2530
{
2631
path: 'deepMerge',
2732
icon: 'deepMerge',

‎pages/library/debounce/index.vue

Lines changed: 94 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,94 @@
1+
<template>
2+
<view class="u-demo">
3+
<view class="u-demo-wrap">
4+
<view class="u-demo-title">演示效果</view>
5+
<view class="u-demo-area">
6+
<view class="no-mode-here">
7+
选择节流或者防抖模式，点击按钮，将会执行回调并显示在下方：
8+
</view>
9+
<view class="u-demo-result-line" v-if="result.length">
10+
<view v-for="(item, index) in result" :key="index">{{(index >= 1) ? '-' : ''}}回调</view>
11+
</view>
12+
</view>
13+
</view>
14+
<view class="u-config-wrap">
15+
<view class="u-button" hover-class="u-button--hover" hover-stay-time="150" @tap="btnClick">
16+
点击触发
17+
</view>
18+
<view class="u-config-title u-border-bottom">
19+
参数配置
20+
</view>
21+
<view class="u-config-item">
22+
<view class="u-item-title">模式</view>
23+
<u-subsection vibrateShort :list="['节流', '防抖']" @change="modeChange"></u-subsection>
24+
</view>
25+
<view class="u-config-item">
26+
<view class="u-item-title">时间间隔</view>
27+
<u-subsection vibrateShort current="1" :list="['500ms', '1000ms', '2000ms']" @change="timeoutChange"></u-subsection>
28+
</view>
29+
<view class="u-config-item">
30+
<view class="u-item-title">执行时机</view>
31+
<u-subsection vibrateShort :list="['开始处', '结束处']" @change="immediateChange"></u-subsection>
32+
</view>
33+
</view>
34+
</view>
35+
</template>
36+
37+
<script>
38+
export default {
39+
data() {
40+
return {
41+
result: [],
42+
timeout: 1000,
43+
immediate: true,
44+
mode: 'throttle'
45+
}
46+
},
47+
methods: {
48+
modeChange(index) {
49+
this.mode = index ? 'debouncd' : 'throttle';
50+
},
51+
timeoutChange(index) {
52+
this.timeout = [500, 1000, 2000][index];
53+
},
54+
immediateChange(index) {
55+
this.immediate = !index;
56+
},
57+
getResult() {
58+
if(this.result.length >= 6) this.result = [];
59+
this.result.push(0);
60+
},
61+
btnClick() {
62+
if(this.mode == 'throttle') {
63+
this.$u.throttle(this.getResult, this.timeout, this.immediate);
64+
} else {
65+
this.$u.debounce(this.getResult, this.timeout, this.immediate);
66+
}
67+
}
68+
}
69+
}
70+
</script>
71+
72+
<style lang="scss" scoped>
73+
.u-button {
74+
margin-top: 50rpx;
75+
margin-bottom: 50rpx;
76+
display: flex;
77+
justify-content: center;
78+
align-items: center;
79+
height: 80rpx;
80+
border-radius: 6rpx;
81+
border: 1px solid $u-type-primary;
82+
color: $u-type-primary;
83+
}
84+
85+
.u-button--hover {
86+
color: #fff;
87+
background-color: $u-type-primary;
88+
}
89+
90+
.u-demo-result-line {
91+
display: flex;
92+
justify-content: center;
93+
}
94+
</style>

‎uview-ui/components/u-alert-tips/u-alert-tips.vue

Lines changed: 51 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -8,13 +8,13 @@
88
borderColor: borderColor
99
}">
1010
<view class="u-icon-wrap">
11-
<u-icon v-if="showIcon" :name="$u.type2icon(type)" :size="description ? 40 : 32" class="u-icon" :color="type"></u-icon>
11+
<u-icon v-if="showIcon" :name="uIcon" :size="description ? 40 : 32" class="u-icon" :color="uIconType" :custom-style="iconStyle"></u-icon>
1212
</view>
1313
<view class="u-alert-content" @tap.stop="click">
14-
<view class="u-alert-title" :style="{fontWeight: description ? 500 : 'normal'}">
14+
<view class="u-alert-title" :style="[uTitleStyle]">
1515
{{title}}
1616
</view>
17-
<view v-if="description" class="u-alert-desc">
17+
<view v-if="description" class="u-alert-desc" :style="[descStyle]">
1818
{{description}}
1919
</view>
2020
</view>
@@ -38,6 +38,10 @@
3838
* @property {String} title 显示的标题文字
3939
* @property {String} description 辅助性文字，颜色比title浅一点，字号也小一点，可选
4040
* @property {String} type 关闭按钮(默认为叉号icon图标)
41+
* @property {String} icon 图标名称
42+
* @property {Object} icon-style 图标的样式，对象形式
43+
* @property {Object} title-style 标题的样式，对象形式
44+
* @property {Object} desc-style 描述的样式，对象形式
4145
* @property {String} close-able 用文字替代关闭图标，close-able为true时有效
4246
* @property {Boolean} show-icon 是否显示左边的辅助图标
4347
* @property {Boolean} show 显示或隐藏组件
@@ -96,12 +100,55 @@
96100
show: {
97101
type: Boolean,
98102
default: true
99-
}
103+
},
104+
// 左边显示的icon
105+
icon: {
106+
type: String,
107+
default: ''
108+
},
109+
// icon的样式
110+
iconStyle: {
111+
type: Object,
112+
default() {
113+
return {}
114+
}
115+
},
116+
// 标题的样式
117+
titleStyle: {
118+
type: Object,
119+
default() {
120+
return {}
121+
}
122+
},
123+
// 描述文字的样式
124+
descStyle: {
125+
type: Object,
126+
default() {
127+
return {}
128+
}
129+
},
100130
},
101131
data() {
102132
return {
103133
}
104134
},
135+
computed: {
136+
uTitleStyle() {
137+
let style = {};
138+
// 如果有描述文字的话，标题进行加粗
139+
style.fontWeight = this.description ? 500 : 'normal';
140+
// 将用户传入样式对象和style合并，传入的优先级比style高，同属性会被覆盖
141+
return this.$u.deepMerge(style, this.titleStyle);
142+
},
143+
uIcon() {
144+
// 如果有设置icon名称就使用，否则根据type主题，推定一个默认的图标
145+
return this.icon ? this.icon : this.$u.type2icon(type);
146+
},
147+
uIconType() {
148+
// 如果有设置图标的样式，优先使用，没有的话，则用type的样式
149+
return Object.keys(this.iconStyle).length ? '' : this.type;
150+
}
151+
},
105152
methods: {
106153
// 点击内容
107154
click() {
@@ -173,16 +220,6 @@
173220
visibility: hidden;
174221
}
175222
176-
@keyframes myfirst {
177-
from {
178-
height: 100%;
179-
}
180-
181-
to {
182-
height: 0
183-
}
184-
}
185-
186223
.u-icon {
187224
margin-right: 16rpx;
188225
}

0 commit comments

Comments
 (0)