Skip to content
Projects
Groups
Snippets
Help
Loading...
Help
Support
Submit feedback
Contribute to GitLab
Sign in / Register
Toggle navigation
U
uview-ui
Project
Project
Details
Activity
Releases
Cycle Analytics
Repository
Repository
Files
Commits
Branches
Tags
Contributors
Graph
Compare
Charts
Issues
0
Issues
0
List
Boards
Labels
Milestones
Merge Requests
0
Merge Requests
0
CI / CD
CI / CD
Pipelines
Jobs
Schedules
Charts
Wiki
Wiki
Snippets
Snippets
Members
Members
Collapse sidebar
Close sidebar
Activity
Graph
Charts
Create a new issue
Jobs
Commits
Issue Boards
Open sidebar
李晖
uview-ui
Commits
e3c5744e
Commit
e3c5744e
authored
Oct 13, 2020
by
yiruiwen
Browse files
Options
Browse Files
Download
Plain Diff
Merge branch 'dev' into yiruiwen
parents
c4ab4f73
8e8d97fe
Changes
6
Hide whitespace changes
Inline
Side-by-side
Showing
6 changed files
with
53 additions
and
17 deletions
+53
-17
README.md
README.md
+1
-1
index.vue
pages/componentsA/tabs/index.vue
+13
-6
index.vue
pages/template/order/index.vue
+2
-1
u-rate.vue
uview-ui/components/u-rate/u-rate.vue
+1
-1
u-tabs-swiper.vue
uview-ui/components/u-tabs-swiper/u-tabs-swiper.vue
+17
-4
u-tabs.vue
uview-ui/components/u-tabs/u-tabs.vue
+19
-4
No files found.
README.md
View file @
e3c5744e
...
@@ -19,7 +19,7 @@ uView UI,是[uni-app](https://uniapp.dcloud.io/)生态优秀的UI框架,全
...
@@ -19,7 +19,7 @@ uView UI,是[uni-app](https://uniapp.dcloud.io/)生态优秀的UI框架,全
## [官方文档:https://www.uviewui.com](https://www.uviewui.com)
## [官方文档:https://www.uviewui.com](https://www.uviewui.com)
### [点击加群交流反馈:1
129077272](https://qm.qq.com/cgi-bin/qm/qr?k=1FfucLpozYbnb7FWo_KsqAdEi1mE3Qrf&jump_from=webapi
)
### [点击加群交流反馈:1
084514613](https://jq.qq.com/?_wv=1027&k=uyZUkSlo
)
## 特性
## 特性
...
...
pages/componentsA/tabs/index.vue
View file @
e3c5744e
...
@@ -4,8 +4,8 @@
...
@@ -4,8 +4,8 @@
<view
class=
"u-demo-title"
>
演示效果
</view>
<view
class=
"u-demo-title"
>
演示效果
</view>
<view
class=
"u-demo-area"
>
<view
class=
"u-demo-area"
>
<u-toast
ref=
"uToast"
></u-toast>
<u-toast
ref=
"uToast"
></u-toast>
<u-tabs
v-if=
"control"
bg-color=
"#fafafa"
:bold=
"bold"
:active-color=
"activeColor"
:list=
"list"
<u-tabs
v-if=
"control"
bg-color=
"#fafafa"
:bold=
"bold"
:active-color=
"activeColor"
:list=
"list"
@
change=
"change"
:current=
"current"
:is-scroll=
"isScroll"
></u-tabs>
@
change=
"change"
:current=
"current"
:is-scroll=
"isScroll"
:offset=
"offset"
></u-tabs>
</view>
</view>
</view>
</view>
<view
class=
"u-config-wrap"
>
<view
class=
"u-config-wrap"
>
...
@@ -38,9 +38,11 @@
...
@@ -38,9 +38,11 @@
return
{
return
{
list
:
[],
list
:
[],
data
:
[{
data
:
[{
name
:
'
关注
'
name
:
'
关注
'
,
count
:
100
},
{
},
{
name
:
'
推荐
'
name
:
'
推荐
'
,
count
:
7
},
{
},
{
name
:
'
电影
'
name
:
'
电影
'
},{
},{
...
@@ -62,7 +64,8 @@
...
@@ -62,7 +64,8 @@
tabCountIndex
:
0
,
tabCountIndex
:
0
,
activeColor
:
this
.
$u
.
color
[
'
primary
'
],
activeColor
:
this
.
$u
.
color
[
'
primary
'
],
bold
:
true
,
bold
:
true
,
control
:
true
control
:
true
,
offset
:
[
5
,
-
5
]
}
}
},
},
onLoad
()
{
onLoad
()
{
...
@@ -75,17 +78,20 @@
...
@@ -75,17 +78,20 @@
this
.
list
=
[];
this
.
list
=
[];
this
.
list
.
push
(
this
.
data
[
0
]);
this
.
list
.
push
(
this
.
data
[
0
]);
this
.
list
.
push
(
this
.
data
[
1
]);
this
.
list
.
push
(
this
.
data
[
1
]);
this
.
offset
=
[
5
,
60
]
}
else
if
(
index
==
1
)
{
}
else
if
(
index
==
1
)
{
this
.
list
=
[];
this
.
list
=
[];
this
.
list
.
push
(
this
.
data
[
0
]);
this
.
list
.
push
(
this
.
data
[
0
]);
this
.
list
.
push
(
this
.
data
[
1
]);
this
.
list
.
push
(
this
.
data
[
1
]);
this
.
list
.
push
(
this
.
data
[
2
]);
this
.
list
.
push
(
this
.
data
[
2
]);
this
.
offset
=
[
5
,
20
]
}
else
{
}
else
{
this
.
list
=
[];
this
.
list
=
[];
this
.
list
.
push
(
this
.
data
[
0
]);
this
.
list
.
push
(
this
.
data
[
0
]);
this
.
list
.
push
(
this
.
data
[
1
]);
this
.
list
.
push
(
this
.
data
[
1
]);
this
.
list
.
push
(
this
.
data
[
2
]);
this
.
list
.
push
(
this
.
data
[
2
]);
this
.
list
.
push
(
this
.
data
[
3
]);
this
.
list
.
push
(
this
.
data
[
3
]);
this
.
offset
=
[
5
,
5
]
}
}
this
.
tabCountIndex
=
index
;
this
.
tabCountIndex
=
index
;
this
.
isScroll
=
false
;
this
.
isScroll
=
false
;
...
@@ -99,6 +105,7 @@
...
@@ -99,6 +105,7 @@
if
(
index
==
0
)
{
if
(
index
==
0
)
{
this
.
isScroll
=
true
;
this
.
isScroll
=
true
;
this
.
list
=
this
.
data
;
this
.
list
=
this
.
data
;
this
.
offset
=
[
5
,
-
5
]
}
else
{
}
else
{
this
.
isScroll
=
false
;
this
.
isScroll
=
false
;
this
.
countChange
(
this
.
tabCountIndex
);
this
.
countChange
(
this
.
tabCountIndex
);
...
@@ -135,6 +142,6 @@
...
@@ -135,6 +142,6 @@
<
style
lang=
"scss"
scoped
>
<
style
lang=
"scss"
scoped
>
.u-config-wrap
{
.u-config-wrap
{
}
}
</
style
>
</
style
>
pages/template/order/index.vue
View file @
e3c5744e
...
@@ -278,7 +278,8 @@ export default {
...
@@ -278,7 +278,8 @@ export default {
name
:
'
待收货
'
name
:
'
待收货
'
},
},
{
{
name
:
'
待评价
'
name
:
'
待评价
'
,
count
:
12
}
}
],
],
current
:
0
,
current
:
0
,
...
...
uview-ui/components/u-rate/u-rate.vue
View file @
e3c5744e
...
@@ -12,7 +12,7 @@
...
@@ -12,7 +12,7 @@
:custom-prefix="customPrefix"
:custom-prefix="customPrefix"
:show-decimal-icon="showDecimalIcon(index)"
:show-decimal-icon="showDecimalIcon(index)"
:percent="decimal"
:percent="decimal"
:inactive
C
olor="inactiveColor"
:inactive
-c
olor="inactiveColor"
>
</u-icon>
>
</u-icon>
</view>
</view>
</view>
</view>
...
...
uview-ui/components/u-tabs-swiper/u-tabs-swiper.vue
View file @
e3c5744e
...
@@ -7,6 +7,7 @@
...
@@ -7,6 +7,7 @@
<view
class=
"u-tabs-scroll-box"
:class=
"
{'u-tabs-scorll-flex': !isScroll}">
<view
class=
"u-tabs-scroll-box"
:class=
"
{'u-tabs-scorll-flex': !isScroll}">
<view
class=
"u-tabs-item"
:style=
"[tabItemStyle(index)]"
<view
class=
"u-tabs-item"
:style=
"[tabItemStyle(index)]"
v-for=
"(item, index) in getTabs"
:key=
"index"
:class=
"[preId + index]"
@
tap=
"emit(index)"
>
v-for=
"(item, index) in getTabs"
:key=
"index"
:class=
"[preId + index]"
@
tap=
"emit(index)"
>
<u-badge
:count=
"item[count] || item['count'] || 0"
:offset=
"offset"
size=
"mini"
></u-badge>
{{
item
[
name
]
||
item
[
'
name
'
]
}}
{{
item
[
name
]
||
item
[
'
name
'
]
}}
</view>
</view>
<view
v-if=
"showBar"
class=
"u-scroll-bar"
:style=
"[tabBarStyle]"
></view>
<view
v-if=
"showBar"
class=
"u-scroll-bar"
:style=
"[tabBarStyle]"
></view>
...
@@ -18,9 +19,7 @@
...
@@ -18,9 +19,7 @@
<
script
>
<
script
>
import
colorGradient
from
'
../../libs/function/colorGradient
'
;
import
colorGradient
from
'
../../libs/function/colorGradient
'
;
let
color
=
colorGradient
;
let
color
=
colorGradient
;
const
{
const
{
windowWidth
}
=
uni
.
getSystemInfoSync
();
windowWidth
}
=
uni
.
getSystemInfoSync
();
const
preId
=
'
UEl_
'
;
const
preId
=
'
UEl_
'
;
/**
/**
...
@@ -43,6 +42,8 @@
...
@@ -43,6 +42,8 @@
* @property {String Number} gutter 单个tab标签的左右内边距之和,单位rpx(默认40)
* @property {String Number} gutter 单个tab标签的左右内边距之和,单位rpx(默认40)
* @property {String} bg-color tabs导航栏的背景颜色(默认#ffffff)
* @property {String} bg-color tabs导航栏的背景颜色(默认#ffffff)
* @property {String} name 组件内部读取的list参数中的属性名,见官网说明(默认name)
* @property {String} name 组件内部读取的list参数中的属性名,见官网说明(默认name)
* @property {String} count 组件内部读取的list参数中的属性名(badge徽标数),同name属性的使用,见官网说明(默认count)
* @property {Array} offset 设置badge徽标数的位置偏移,格式为 [x, y],也即设置的为top和right的值,单位rpx(默认[5, 20])
* @property {Boolean} bold 激活选项的字体是否加粗(默认true)
* @property {Boolean} bold 激活选项的字体是否加粗(默认true)
* @event {Function} change 点击标签时触发
* @event {Function} change 点击标签时触发
* @example <u-tabs-swiper ref="tabs" :list="list" :is-scroll="false"></u-tabs-swiper>
* @example <u-tabs-swiper ref="tabs" :list="list" :is-scroll="false"></u-tabs-swiper>
...
@@ -127,11 +128,23 @@
...
@@ -127,11 +128,23 @@
type
:
String
,
type
:
String
,
default
:
'
window
'
default
:
'
window
'
},
},
// 读取传入的数组对象的属性
// 读取传入的数组对象的属性
(tab名称)
name
:
{
name
:
{
type
:
String
,
type
:
String
,
default
:
'
name
'
default
:
'
name
'
},
},
// 读取传入的数组对象的属性(徽标数)
count
:
{
type
:
String
,
default
:
'
count
'
},
// 徽标数位置偏移
offset
:
{
type
:
Array
,
default
:
()
=>
{
return
[
5
,
20
]
}
},
// 活动tab字体是否加粗
// 活动tab字体是否加粗
bold
:
{
bold
:
{
type
:
Boolean
,
type
:
Boolean
,
...
...
uview-ui/components/u-tabs/u-tabs.vue
View file @
e3c5744e
...
@@ -8,6 +8,7 @@
...
@@ -8,6 +8,7 @@
<view
class=
"u-scroll-box"
:class=
"
{'u-tabs-scorll-flex': !isScroll}">
<view
class=
"u-scroll-box"
:class=
"
{'u-tabs-scorll-flex': !isScroll}">
<view
class=
"u-tab-item u-line-1"
: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)]"
>
:style=
"[tabItemStyle(index)]"
>
<u-badge
:count=
"item[count] || item['count'] || 0"
:offset=
"offset"
size=
"mini"
></u-badge>
{{
item
[
name
]
||
item
[
'
name
'
]
}}
{{
item
[
name
]
||
item
[
'
name
'
]
}}
</view>
</view>
<view
v-if=
"showBar"
class=
"u-tab-bar"
:style=
"[tabBarStyle]"
></view>
<view
v-if=
"showBar"
class=
"u-tab-bar"
:style=
"[tabBarStyle]"
></view>
...
@@ -20,7 +21,7 @@
...
@@ -20,7 +21,7 @@
<
script
>
<
script
>
/**
/**
* tabs 标签
* tabs 标签
* @description 该组件,是一个tabs标签组件,在标签多的时候,可以配置为左右滑动,标签少的时候,可以禁止滑动。 该组件的一个特点是配置为滚动模式时,激活的tab会自动移动到组件的中间位置。
* @description 该组件,是一个tabs标签组件,在标签多的时候,可以配置为左右滑动,标签少的时候,可以禁止滑动。 该组件的一个特点是配置为滚动模式时,激活的tab会自动移动到组件的中间位置。
* @tutorial https://www.uviewui.com/components/tabs.html
* @tutorial https://www.uviewui.com/components/tabs.html
* @property {Boolean} is-scroll tabs是否可以左右拖动(默认true)
* @property {Boolean} is-scroll tabs是否可以左右拖动(默认true)
* @property {Array} list 标签数组,元素为对象,如[{name: '推荐'}]
* @property {Array} list 标签数组,元素为对象,如[{name: '推荐'}]
...
@@ -38,7 +39,9 @@
...
@@ -38,7 +39,9 @@
* @property {String Number} item-width 标签的宽度(默认auto)
* @property {String Number} item-width 标签的宽度(默认auto)
* @property {String Number} gutter 单个tab标签的左右内边距之和,单位rpx(默认40)
* @property {String Number} gutter 单个tab标签的左右内边距之和,单位rpx(默认40)
* @property {String} bg-color tabs导航栏的背景颜色(默认#ffffff)
* @property {String} bg-color tabs导航栏的背景颜色(默认#ffffff)
* @property {String} name 组件内部读取的list参数中的属性名,见官网说明(默认name)
* @property {String} name 组件内部读取的list参数中的属性名(tab名称),见官网说明(默认name)
* @property {String} count 组件内部读取的list参数中的属性名(badge徽标数),同name属性的使用,见官网说明(默认count)
* @property {Array} offset 设置badge徽标数的位置偏移,格式为 [x, y],也即设置的为top和right的值,单位rpx(默认[5, 20])
* @property {Boolean} bold 激活选项的字体是否加粗(默认true)
* @property {Boolean} bold 激活选项的字体是否加粗(默认true)
* @event {Function} change 点击标签时触发
* @event {Function} change 点击标签时触发
* @example <u-tabs ref="tabs" :list="list" :is-scroll="false"></u-tabs>
* @example <u-tabs ref="tabs" :list="list" :is-scroll="false"></u-tabs>
...
@@ -108,11 +111,23 @@
...
@@ -108,11 +111,23 @@
type
:
String
,
type
:
String
,
default
:
'
#ffffff
'
default
:
'
#ffffff
'
},
},
// 读取传入的数组对象的属性
// 读取传入的数组对象的属性
(tab名称)
name
:
{
name
:
{
type
:
String
,
type
:
String
,
default
:
'
name
'
default
:
'
name
'
},
},
// 读取传入的数组对象的属性(徽标数)
count
:
{
type
:
String
,
default
:
'
count
'
},
// 徽标数位置偏移
offset
:
{
type
:
Array
,
default
:
()
=>
{
return
[
5
,
20
]
}
},
// 活动tab字体是否加粗
// 活动tab字体是否加粗
bold
:
{
bold
:
{
type
:
Boolean
,
type
:
Boolean
,
...
@@ -290,7 +305,7 @@
...
@@ -290,7 +305,7 @@
<
style
lang=
"scss"
scoped
>
<
style
lang=
"scss"
scoped
>
@import
"../../libs/css/style.components.scss"
;
@import
"../../libs/css/style.components.scss"
;
view
,
view
,
scroll-view
{
scroll-view
{
box-sizing
:
border-box
;
box-sizing
:
border-box
;
...
...
Write
Preview
Markdown
is supported
0%
Try again
or
attach a new file
Attach a file
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment