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
95496a55
Commit
95496a55
authored
Jun 24, 2020
by
wlxuqu
Browse files
Options
Browse Files
Download
Email Patches
Plain Diff
优化cell和filed组件,无需强制结合ceel-group使用
parent
f4070f28
Changes
7
Hide whitespace changes
Inline
Side-by-side
Showing
7 changed files
with
54 additions
and
71 deletions
+54
-71
index.vue
pages/componentsA/field/index.vue
+19
-21
index.vue
pages/componentsC/cell/index.vue
+1
-1
u-cell-group.vue
uview-ui/components/u-cell-group/u-cell-group.vue
+0
-5
u-cell-item.vue
uview-ui/components/u-cell-item/u-cell-item.vue
+10
-17
u-field.vue
uview-ui/components/u-field/u-field.vue
+14
-21
getParent.js
uview-ui/libs/function/getParent.js
+9
-5
theme.scss
uview-ui/theme.scss
+1
-1
No files found.
pages/componentsA/field/index.vue
View file @
95496a55
...
@@ -3,27 +3,25 @@
...
@@ -3,27 +3,25 @@
<view
class=
"u-demo-wrap"
style=
"background-color: #FFFFFF;"
>
<view
class=
"u-demo-wrap"
style=
"background-color: #FFFFFF;"
>
<view
class=
"u-demo-title"
>
演示效果
</view>
<view
class=
"u-demo-title"
>
演示效果
</view>
<view
class=
"u-demo-area"
>
<view
class=
"u-demo-area"
>
<u-cell-group>
<u-field
<u-field
v-model=
"mobile"
v-model=
"mobile"
label=
"手机号"
label=
"手机号"
:error-message=
"errorMessage"
:error-message=
"errorMessage"
placeholder=
"请填写手机号"
placeholder=
"请填写手机号"
:required=
"required"
:required=
"required"
:icon=
"icon1"
:icon=
"icon1"
:type=
"type"
:type=
"type"
>
>
</u-field>
</u-field>
<u-field
<u-field
v-model=
"code"
v-model=
"code"
label=
"验证码"
label=
"验证码"
placeholder=
"请填写验证码"
placeholder=
"请填写验证码"
:required=
"required"
:required=
"required"
:icon=
"icon2"
:icon=
"icon2"
>
>
<u-button
v-if=
"showBtn"
slot=
"right"
size=
"mini"
type=
"success"
>
发送验证码
</u-button>
<u-button
v-if=
"showBtn"
slot=
"right"
size=
"mini"
type=
"success"
>
发送验证码
</u-button>
</u-field>
</u-field>
</u-cell-group>
</view>
</view>
</view>
</view>
<view
class=
"u-config-wrap"
>
<view
class=
"u-config-wrap"
>
...
...
pages/componentsC/cell/index.vue
View file @
95496a55
...
@@ -12,7 +12,7 @@
...
@@ -12,7 +12,7 @@
<u-badge
:absolute=
"false"
v-if=
"rightSlot == 'badge'"
count=
"105"
slot=
"right-icon"
></u-badge>
<u-badge
:absolute=
"false"
v-if=
"rightSlot == 'badge'"
count=
"105"
slot=
"right-icon"
></u-badge>
<u-switch
v-if=
"rightSlot == 'switch'"
slot=
"right-icon"
v-model=
"checked"
></u-switch>
<u-switch
v-if=
"rightSlot == 'switch'"
slot=
"right-icon"
v-model=
"checked"
></u-switch>
</u-cell-item>
</u-cell-item>
<u-cell-item
value=
""
title=
"铁马冰河入梦来"
value=
"行万里路"
:arrow=
"false"
>
<u-cell-item
:border-bottom=
"false"
value=
""
title=
"铁马冰河入梦来"
value=
"行万里路"
:arrow=
"false"
>
<u-icon
slot=
"icon"
size=
"34"
name=
"calendar"
style=
"margin-right: 5px;"
></u-icon>
<u-icon
slot=
"icon"
size=
"34"
name=
"calendar"
style=
"margin-right: 5px;"
></u-icon>
<u-icon
slot=
"right-icon"
size=
"34"
name=
"calendar"
></u-icon>
<u-icon
slot=
"right-icon"
size=
"34"
name=
"calendar"
></u-icon>
<u-field
slot=
"value"
></u-field>
<u-field
slot=
"value"
></u-field>
...
...
uview-ui/components/u-cell-group/u-cell-group.vue
View file @
95496a55
...
@@ -46,11 +46,6 @@
...
@@ -46,11 +46,6 @@
index
:
0
,
index
:
0
,
}
}
},
},
provide
()
{
return
{
uCellGroup
:
this
}
},
}
}
</
script
>
</
script
>
...
...
uview-ui/components/u-cell-item/u-cell-item.vue
View file @
95496a55
...
@@ -2,7 +2,7 @@
...
@@ -2,7 +2,7 @@
<view
<view
@
tap=
"click"
@
tap=
"click"
class=
"u-cell"
class=
"u-cell"
:class=
"
{ 'u-
cell-border': itemIndex > 0
&&
borderBottom
, 'u-col-center': center, 'u-border-gap': borderGap, 'u-cell--required': required }"
:class=
"
{ 'u-
border-bottom': borderBottom, 'u-border-top': borderTop
, 'u-col-center': center, 'u-border-gap': borderGap, 'u-cell--required': required }"
hover-stay-time="150"
hover-stay-time="150"
:hover-class="hoverClass"
:hover-class="hoverClass"
:style="{
:style="{
...
@@ -51,7 +51,8 @@
...
@@ -51,7 +51,8 @@
* @property {String} icon 左侧图标名,只支持uView内置图标,见Icon 图标
* @property {String} icon 左侧图标名,只支持uView内置图标,见Icon 图标
* @property {String} value 右侧内容
* @property {String} value 右侧内容
* @property {String} label 标题下方的描述信息
* @property {String} label 标题下方的描述信息
* @property {Boolean} border-bottom 是否显示每个cell的下边框(默认true)
* @property {Boolean} border-bottom 是否显示cell的下边框(默认true)
* @property {Boolean} border-top 是否显示cell的上边框(默认false)
* @property {Boolean} center 是否使内容垂直居中(默认false)
* @property {Boolean} center 是否使内容垂直居中(默认false)
* @property {String} hover-class 是否开启点击反馈,none为无效果(默认true)
* @property {String} hover-class 是否开启点击反馈,none为无效果(默认true)
* @property {Boolean} border-gap border-bottom为true时,Cell列表中间的条目的下边框是否与左边有一个间隔(默认true)
* @property {Boolean} border-gap border-bottom为true时,Cell列表中间的条目的下边框是否与左边有一个间隔(默认true)
...
@@ -89,11 +90,16 @@ export default {
...
@@ -89,11 +90,16 @@ export default {
type
:
[
String
,
Number
],
type
:
[
String
,
Number
],
default
:
''
default
:
''
},
},
// 是否显示
内
边框
// 是否显示
下
边框
borderBottom
:
{
borderBottom
:
{
type
:
Boolean
,
type
:
Boolean
,
default
:
true
default
:
true
},
},
// 是否显示上边框
borderTop
:
{
type
:
Boolean
,
default
:
false
},
// 多个cell中,中间的cell显示下划线时,下划线是否给一个到左边的距离
// 多个cell中,中间的cell显示下划线时,下划线是否给一个到左边的距离
borderGap
:
{
borderGap
:
{
type
:
Boolean
,
type
:
Boolean
,
...
@@ -171,24 +177,11 @@ export default {
...
@@ -171,24 +177,11 @@ export default {
default
:
34
default
:
34
}
}
},
},
inject
:
{
uCellGroup
:
{
// 添加默认值,是为了能让u-cell-item组件无需u-cell-group组件嵌套亦可单独使用
default
()
{
return
{
index
:
0
}
}
}
},
data
()
{
data
()
{
return
{
return
{
itemIndex
:
0
};
};
},
},
created
()
{
this
.
itemIndex
=
this
.
uCellGroup
.
index
++
;
},
computed
:
{
computed
:
{
arrowStyle
()
{
arrowStyle
()
{
let
style
=
{};
let
style
=
{};
...
...
uview-ui/components/u-field/u-field.vue
View file @
95496a55
<
template
>
<
template
>
<view
class=
"u-field"
:class=
"
{'u-
field-border': itemIndex > 0
}">
<view
class=
"u-field"
:class=
"
{'u-
border-top': borderTop, 'u-border-bottom': borderBottom
}">
<view
class=
"u-field-inner"
:class=
"[type == 'textarea' ? 'u-textarea-inner' : '', 'u-label-postion-' + labelPosition]"
>
<view
class=
"u-field-inner"
:class=
"[type == 'textarea' ? 'u-textarea-inner' : '', 'u-label-postion-' + labelPosition]"
>
<view
class=
"u-label"
:class=
"[required ? 'u-required' : '']"
:style=
"
{
<view
class=
"u-label"
:class=
"[required ? 'u-required' : '']"
:style=
"
{
justifyContent: justifyContent,
justifyContent: justifyContent,
...
@@ -65,6 +65,8 @@
...
@@ -65,6 +65,8 @@
* @property {Object} field-style 自定义输入框的样式,对象形式
* @property {Object} field-style 自定义输入框的样式,对象形式
* @property {Number | String} clear-size 清除图标的大小,单位rpx(默认30)
* @property {Number | String} clear-size 清除图标的大小,单位rpx(默认30)
* @property {String} input-align 输入框内容对齐方式(默认left)
* @property {String} input-align 输入框内容对齐方式(默认left)
* @property {Boolean} border-bottom 是否显示field的下边框(默认true)
* @property {Boolean} border-top 是否显示field的上边框(默认false)
* @property {String} icon-color 左边通过icon配置的图标的颜色(默认#606266)
* @property {String} icon-color 左边通过icon配置的图标的颜色(默认#606266)
* @property {Boolean} auto-height 是否自动增高输入区域,type为textarea时有效(默认true)
* @property {Boolean} auto-height 是否自动增高输入区域,type为textarea时有效(默认true)
* @property {String Boolean} error-message 显示的错误提示内容,如果为空字符串或者false,则不显示错误信息
* @property {String Boolean} error-message 显示的错误提示内容,如果为空字符串或者false,则不显示错误信息
...
@@ -169,20 +171,24 @@ export default {
...
@@ -169,20 +171,24 @@ export default {
default
()
{
default
()
{
return
{}
return
{}
}
}
}
},
// 是否显示上边框
borderTop
:
{
type
:
Boolean
,
default
:
false
},
// 是否显示下边框
borderBottom
:
{
type
:
Boolean
,
default
:
true
},
},
},
inject
:
[
'
uCellGroup
'
],
data
()
{
data
()
{
return
{
return
{
focused
:
false
,
focused
:
false
,
itemIndex
:
0
,
itemIndex
:
0
,
};
};
},
},
created
()
{
if
(
this
.
uCellGroup
)
{
this
.
itemIndex
=
this
.
uCellGroup
.
index
++
;
}
},
computed
:
{
computed
:
{
inputWrapStyle
()
{
inputWrapStyle
()
{
let
style
=
{};
let
style
=
{};
...
@@ -343,19 +349,6 @@ export default {
...
@@ -343,19 +349,6 @@ export default {
align-items
:
center
;
align-items
:
center
;
}
}
.u-field-border
:after
{
left
:
32rpx
!
important
;
position
:
absolute
;
box-sizing
:
border-box
;
content
:
' '
;
pointer-events
:
none
;
right
:
0
;
top
:
0
;
border-bottom
:
1px
solid
$u-border-color
;
-webkit-transform
:
scaleY
(
0
.5
);
transform
:
scaleY
(
0
.5
);
}
.u-error-message
{
.u-error-message
{
color
:
$u-type-error
;
color
:
$u-type-error
;
font-size
:
26rpx
;
font-size
:
26rpx
;
...
...
uview-ui/libs/function/getParent.js
View file @
95496a55
...
@@ -6,14 +6,18 @@ export default function getParent(name, keys) {
...
@@ -6,14 +6,18 @@ export default function getParent(name, keys) {
while
(
parent
)
{
while
(
parent
)
{
// 父组件
// 父组件
if
(
parent
.
$options
.
name
!==
name
)
{
if
(
parent
.
$options
.
name
!==
name
)
{
// 如果组件的name不相等,继续上一级寻找
parent
=
parent
.
$parent
;
parent
=
parent
.
$parent
;
}
else
{
}
else
{
return
keys
.
reduce
((
result
,
key
)
=>
{
let
data
=
{};
result
[
key
]
=
parent
[
key
];
// 历遍传过来的对象参数
return
result
;
for
(
let
i
in
keys
)
{
},
{});
// 如果父组件有此值则用,无此值则用默认值
data
[
i
]
=
parent
[
i
]
?
parent
[
i
]
:
keys
[
i
];
}
return
data
;
}
}
}
}
return
null
;
return
{}
;
}
}
\ No newline at end of file
uview-ui/theme.scss
View file @
95496a55
...
@@ -6,7 +6,7 @@ $u-main-color: #303133;
...
@@ -6,7 +6,7 @@ $u-main-color: #303133;
$u-content-color
:
#606266
;
$u-content-color
:
#606266
;
$u-tips-color
:
#909399
;
$u-tips-color
:
#909399
;
$u-light-color
:
#c0c4cc
;
$u-light-color
:
#c0c4cc
;
$u-border-color
:
#e4e7
ed
;
$u-border-color
:
r
ed
;
$u-bg-color
:
#f3f4f6
;
$u-bg-color
:
#f3f4f6
;
$u-type-primary
:
#2979ff
;
$u-type-primary
:
#2979ff
;
...
...
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