diff --git a/example/pages/action-sheet/index.js b/example/pages/action-sheet/index.js
index cc8c42852..7142137de 100644
--- a/example/pages/action-sheet/index.js
+++ b/example/pages/action-sheet/index.js
@@ -48,6 +48,7 @@ Page({
toggleActionSheet5() {
this.toggle('show5');
},
+
toggleActionSheet6() {
this.toggle('show6');
},
diff --git a/example/pages/action-sheet/index.wxml b/example/pages/action-sheet/index.wxml
index 5dd757a55..36c775e5f 100644
--- a/example/pages/action-sheet/index.wxml
+++ b/example/pages/action-sheet/index.wxml
@@ -4,7 +4,6 @@
show="{{ show1 }}"
actions="{{ action1 }}"
bind:close="toggleActionSheet1"
- bind:select="toggleActionSheet1"
/>
@@ -14,8 +13,6 @@
show="{{ show2 }}"
actions="{{ action2 }}"
bind:close="toggleActionSheet2"
- bind:cancel="toggleActionSheet2"
- bind:select="toggleActionSheet2"
/>
diff --git a/packages/action-sheet/index.less b/packages/action-sheet/index.less
index 151e4afbd..71028ba53 100644
--- a/packages/action-sheet/index.less
+++ b/packages/action-sheet/index.less
@@ -7,9 +7,10 @@
&__item,
&__cancel {
+ padding: 14px @padding-md;
text-align: center;
.theme(font-size, '@action-sheet-item-font-size');
- .theme(line-height, '@action-sheet-item-height');
+ .theme(line-height, '@action-sheet-item-line-height');
.theme(background-color, '@action-sheet-item-background');
&--hover {
@@ -24,13 +25,12 @@
&__cancel {
.theme(color, '@action-sheet-cancel-text-color');
+ }
- &::before {
- display: block;
- content: ' ';
- .theme(height, '@action-sheet-cancel-padding-top');
- .theme(background-color, '@action-sheet-cancel-padding-color');
- }
+ &__gap {
+ display: block;
+ .theme(height, '@action-sheet-cancel-padding-top');
+ .theme(background-color, '@action-sheet-cancel-padding-color');
}
&__item--disabled {
@@ -42,9 +42,10 @@
}
&__subname {
- .theme(margin-left, '@padding-base');
+ .theme(margin-top, '@padding-xs');
.theme(font-size, '@action-sheet-subname-font-size');
.theme(color, '@action-sheet-subname-color');
+ .theme(line-height, '@action-sheet-subname-line-height');
}
&__header {
@@ -74,6 +75,5 @@
&__loading {
display: flex !important;
- .theme(height, '@action-sheet-item-height');
}
}
diff --git a/packages/action-sheet/index.wxml b/packages/action-sheet/index.wxml
index 48920f002..c2bebcacf 100644
--- a/packages/action-sheet/index.wxml
+++ b/packages/action-sheet/index.wxml
@@ -49,19 +49,21 @@
>
{{ item.name }}
- {{ item.subname }}
+ {{ item.subname }}
-
- {{ cancelText }}
-
+
+
+
+ {{ cancelText }}
+
+
diff --git a/packages/common/style/var.less b/packages/common/style/var.less
index 668d297e7..16c6a5310 100644
--- a/packages/common/style/var.less
+++ b/packages/common/style/var.less
@@ -72,13 +72,14 @@
@action-sheet-description-color: @gray-6;
@action-sheet-description-font-size: @font-size-md;
@action-sheet-description-line-height: 20px;
-@action-sheet-item-height: 50px;
@action-sheet-item-background: @white;
@action-sheet-item-font-size: @font-size-lg;
+@action-sheet-item-line-height: 22px;
@action-sheet-item-text-color: @text-color;
@action-sheet-item-disabled-text-color: @gray-5;
@action-sheet-subname-color: @gray-6;
@action-sheet-subname-font-size: @font-size-sm;
+@action-sheet-subname-line-height: 20px;
@action-sheet-close-icon-size: 22px;
@action-sheet-close-icon-color: @gray-5;
@action-sheet-close-icon-padding: 0 @padding-md;