style(Picker): improve text size adjust (#6205)

* style(Picker): improve text size adjust

* chore: remove text align center

* fix: snapsho
This commit is contained in:
neverland
2020-05-04 12:02:46 +08:00
committed by GitHub
parent 9215df7692
commit 8b328eabed
10 changed files with 2178 additions and 796 deletions

View File

@@ -270,7 +270,6 @@ export default createComponent({
tabindex: disabled ? -1 : 0,
},
class: [
'van-ellipsis',
bem('item', {
disabled,
selected: index === this.currentIndex,
@@ -283,13 +282,18 @@ export default createComponent({
},
};
if (this.allowHtml) {
data.domProps = {
innerHTML: text,
};
}
const childData = {
class: 'van-ellipsis',
domProps: {
[this.allowHtml ? 'innerHTML' : 'innerText']: text,
},
};
return <li {...data}>{this.allowHtml ? '' : text}</li>;
return (
<li {...data}>
<div {...childData} />
</li>
);
});
},
},
@@ -299,7 +303,6 @@ export default createComponent({
transform: `translate3d(0, ${this.offset + this.baseOffset}px, 0)`,
transitionDuration: `${this.duration}ms`,
transitionProperty: this.duration ? 'all' : 'none',
lineHeight: `${this.itemHeight}px`,
};
return (

View File

@@ -87,16 +87,17 @@
flex: 1;
overflow: hidden;
font-size: @picker-option-font-size;
text-align: center;
&__wrapper {
transition-timing-function: cubic-bezier(0.23, 1, 0.68, 1);
}
&__item {
padding: 0 5px;
display: flex;
align-items: center;
justify-content: center;
padding: 0 @padding-base;
color: @picker-option-text-color;
-webkit-text-size-adjust: 100%; /* avoid iOS text size adjust */
&--disabled {
opacity: @picker-option-disabled-opacity;

View File

@@ -7,12 +7,22 @@ exports[`renders demo correctly 1`] = `
<!---->
<div class="van-picker__columns" style="height: 220px;">
<div class="van-picker-column">
<ul class="van-picker-column__wrapper" style="transform: translate3d(0, 88px, 0); transition-duration: 0ms; transition-property: none; line-height: 44px;">
<li role="button" tabindex="0" class="van-ellipsis van-picker-column__item van-picker-column__item--selected" style="height: 44px;">杭州</li>
<li role="button" tabindex="0" class="van-ellipsis van-picker-column__item" style="height: 44px;">宁波</li>
<li role="button" tabindex="0" class="van-ellipsis van-picker-column__item" style="height: 44px;">温州</li>
<li role="button" tabindex="0" class="van-ellipsis van-picker-column__item" style="height: 44px;">嘉兴</li>
<li role="button" tabindex="0" class="van-ellipsis van-picker-column__item" style="height: 44px;">湖州</li>
<ul class="van-picker-column__wrapper" style="transform: translate3d(0, 88px, 0); transition-duration: 0ms; transition-property: none;">
<li role="button" tabindex="0" class="van-picker-column__item van-picker-column__item--selected" style="height: 44px;">
<div class="van-ellipsis">杭州</div>
</li>
<li role="button" tabindex="0" class="van-picker-column__item" style="height: 44px;">
<div class="van-ellipsis">宁波</div>
</li>
<li role="button" tabindex="0" class="van-picker-column__item" style="height: 44px;">
<div class="van-ellipsis">温州</div>
</li>
<li role="button" tabindex="0" class="van-picker-column__item" style="height: 44px;">
<div class="van-ellipsis">嘉兴</div>
</li>
<li role="button" tabindex="0" class="van-picker-column__item" style="height: 44px;">
<div class="van-ellipsis">湖州</div>
</li>
</ul>
</div>
<div class="van-picker__mask" style="background-size: 100% 88px;"></div>
@@ -26,12 +36,22 @@ exports[`renders demo correctly 1`] = `
<!---->
<div class="van-picker__columns" style="height: 220px;">
<div class="van-picker-column">
<ul class="van-picker-column__wrapper" style="transform: translate3d(0, 0px, 0); transition-duration: 0ms; transition-property: none; line-height: 44px;">
<li role="button" tabindex="0" class="van-ellipsis van-picker-column__item" style="height: 44px;">杭州</li>
<li role="button" tabindex="0" class="van-ellipsis van-picker-column__item" style="height: 44px;">宁波</li>
<li role="button" tabindex="0" class="van-ellipsis van-picker-column__item van-picker-column__item--selected" style="height: 44px;">温州</li>
<li role="button" tabindex="0" class="van-ellipsis van-picker-column__item" style="height: 44px;">嘉兴</li>
<li role="button" tabindex="0" class="van-ellipsis van-picker-column__item" style="height: 44px;">湖州</li>
<ul class="van-picker-column__wrapper" style="transform: translate3d(0, 0px, 0); transition-duration: 0ms; transition-property: none;">
<li role="button" tabindex="0" class="van-picker-column__item" style="height: 44px;">
<div class="van-ellipsis">杭州</div>
</li>
<li role="button" tabindex="0" class="van-picker-column__item" style="height: 44px;">
<div class="van-ellipsis">宁波</div>
</li>
<li role="button" tabindex="0" class="van-picker-column__item van-picker-column__item--selected" style="height: 44px;">
<div class="van-ellipsis">温州</div>
</li>
<li role="button" tabindex="0" class="van-picker-column__item" style="height: 44px;">
<div class="van-ellipsis">嘉兴</div>
</li>
<li role="button" tabindex="0" class="van-picker-column__item" style="height: 44px;">
<div class="van-ellipsis">湖州</div>
</li>
</ul>
</div>
<div class="van-picker__mask" style="background-size: 100% 88px;"></div>
@@ -48,12 +68,22 @@ exports[`renders demo correctly 1`] = `
<!---->
<div class="van-picker__columns" style="height: 220px;">
<div class="van-picker-column">
<ul class="van-picker-column__wrapper" style="transform: translate3d(0, 88px, 0); transition-duration: 0ms; transition-property: none; line-height: 44px;">
<li role="button" tabindex="0" class="van-ellipsis van-picker-column__item van-picker-column__item--selected" style="height: 44px;">杭州</li>
<li role="button" tabindex="0" class="van-ellipsis van-picker-column__item" style="height: 44px;">宁波</li>
<li role="button" tabindex="0" class="van-ellipsis van-picker-column__item" style="height: 44px;">温州</li>
<li role="button" tabindex="0" class="van-ellipsis van-picker-column__item" style="height: 44px;">嘉兴</li>
<li role="button" tabindex="0" class="van-ellipsis van-picker-column__item" style="height: 44px;">湖州</li>
<ul class="van-picker-column__wrapper" style="transform: translate3d(0, 88px, 0); transition-duration: 0ms; transition-property: none;">
<li role="button" tabindex="0" class="van-picker-column__item van-picker-column__item--selected" style="height: 44px;">
<div class="van-ellipsis">杭州</div>
</li>
<li role="button" tabindex="0" class="van-picker-column__item" style="height: 44px;">
<div class="van-ellipsis">宁波</div>
</li>
<li role="button" tabindex="0" class="van-picker-column__item" style="height: 44px;">
<div class="van-ellipsis">温州</div>
</li>
<li role="button" tabindex="0" class="van-picker-column__item" style="height: 44px;">
<div class="van-ellipsis">嘉兴</div>
</li>
<li role="button" tabindex="0" class="van-picker-column__item" style="height: 44px;">
<div class="van-ellipsis">湖州</div>
</li>
</ul>
</div>
<div class="van-picker__mask" style="background-size: 100% 88px;"></div>
@@ -70,19 +100,35 @@ exports[`renders demo correctly 1`] = `
<!---->
<div class="van-picker__columns" style="height: 220px;">
<div class="van-picker-column">
<ul class="van-picker-column__wrapper" style="transform: translate3d(0, 0px, 0); transition-duration: 0ms; transition-property: none; line-height: 44px;">
<li role="button" tabindex="0" class="van-ellipsis van-picker-column__item" style="height: 44px;">周一</li>
<li role="button" tabindex="0" class="van-ellipsis van-picker-column__item" style="height: 44px;">周</li>
<li role="button" tabindex="0" class="van-ellipsis van-picker-column__item van-picker-column__item--selected" style="height: 44px;">周三</li>
<li role="button" tabindex="0" class="van-ellipsis van-picker-column__item" style="height: 44px;">周四</li>
<li role="button" tabindex="0" class="van-ellipsis van-picker-column__item" style="height: 44px;">周</li>
<ul class="van-picker-column__wrapper" style="transform: translate3d(0, 0px, 0); transition-duration: 0ms; transition-property: none;">
<li role="button" tabindex="0" class="van-picker-column__item" style="height: 44px;">
<div class="van-ellipsis">周</div>
</li>
<li role="button" tabindex="0" class="van-picker-column__item" style="height: 44px;">
<div class="van-ellipsis">周</div>
</li>
<li role="button" tabindex="0" class="van-picker-column__item van-picker-column__item--selected" style="height: 44px;">
<div class="van-ellipsis">周三</div>
</li>
<li role="button" tabindex="0" class="van-picker-column__item" style="height: 44px;">
<div class="van-ellipsis">周四</div>
</li>
<li role="button" tabindex="0" class="van-picker-column__item" style="height: 44px;">
<div class="van-ellipsis">周五</div>
</li>
</ul>
</div>
<div class="van-picker-column">
<ul class="van-picker-column__wrapper" style="transform: translate3d(0, 44px, 0); transition-duration: 0ms; transition-property: none; line-height: 44px;">
<li role="button" tabindex="0" class="van-ellipsis van-picker-column__item" style="height: 44px;">上午</li>
<li role="button" tabindex="0" class="van-ellipsis van-picker-column__item van-picker-column__item--selected" style="height: 44px;">午</li>
<li role="button" tabindex="0" class="van-ellipsis van-picker-column__item" style="height: 44px;">晚上</li>
<ul class="van-picker-column__wrapper" style="transform: translate3d(0, 44px, 0); transition-duration: 0ms; transition-property: none;">
<li role="button" tabindex="0" class="van-picker-column__item" style="height: 44px;">
<div class="van-ellipsis">午</div>
</li>
<li role="button" tabindex="0" class="van-picker-column__item van-picker-column__item--selected" style="height: 44px;">
<div class="van-ellipsis">下午</div>
</li>
<li role="button" tabindex="0" class="van-picker-column__item" style="height: 44px;">
<div class="van-ellipsis">晚上</div>
</li>
</ul>
</div>
<div class="van-picker__mask" style="background-size: 100% 88px;"></div>
@@ -99,21 +145,33 @@ exports[`renders demo correctly 1`] = `
<!---->
<div class="van-picker__columns" style="height: 220px;">
<div class="van-picker-column">
<ul class="van-picker-column__wrapper" style="transform: translate3d(0, 88px, 0); transition-duration: 0ms; transition-property: none; line-height: 44px;">
<li role="button" tabindex="0" class="van-ellipsis van-picker-column__item van-picker-column__item--selected" style="height: 44px;">浙江</li>
<li role="button" tabindex="0" class="van-ellipsis van-picker-column__item" style="height: 44px;">福建</li>
<ul class="van-picker-column__wrapper" style="transform: translate3d(0, 88px, 0); transition-duration: 0ms; transition-property: none;">
<li role="button" tabindex="0" class="van-picker-column__item van-picker-column__item--selected" style="height: 44px;">
<div class="van-ellipsis">浙江</div>
</li>
<li role="button" tabindex="0" class="van-picker-column__item" style="height: 44px;">
<div class="van-ellipsis">福建</div>
</li>
</ul>
</div>
<div class="van-picker-column">
<ul class="van-picker-column__wrapper" style="transform: translate3d(0, 88px, 0); transition-duration: 0ms; transition-property: none; line-height: 44px;">
<li role="button" tabindex="0" class="van-ellipsis van-picker-column__item van-picker-column__item--selected" style="height: 44px;">杭州</li>
<li role="button" tabindex="0" class="van-ellipsis van-picker-column__item" style="height: 44px;">州</li>
<ul class="van-picker-column__wrapper" style="transform: translate3d(0, 88px, 0); transition-duration: 0ms; transition-property: none;">
<li role="button" tabindex="0" class="van-picker-column__item van-picker-column__item--selected" style="height: 44px;">
<div class="van-ellipsis">州</div>
</li>
<li role="button" tabindex="0" class="van-picker-column__item" style="height: 44px;">
<div class="van-ellipsis">温州</div>
</li>
</ul>
</div>
<div class="van-picker-column">
<ul class="van-picker-column__wrapper" style="transform: translate3d(0, 88px, 0); transition-duration: 0ms; transition-property: none; line-height: 44px;">
<li role="button" tabindex="0" class="van-ellipsis van-picker-column__item van-picker-column__item--selected" style="height: 44px;">西湖区</li>
<li role="button" tabindex="0" class="van-ellipsis van-picker-column__item" style="height: 44px;">余杭区</li>
<ul class="van-picker-column__wrapper" style="transform: translate3d(0, 88px, 0); transition-duration: 0ms; transition-property: none;">
<li role="button" tabindex="0" class="van-picker-column__item van-picker-column__item--selected" style="height: 44px;">
<div class="van-ellipsis">西湖区</div>
</li>
<li role="button" tabindex="0" class="van-picker-column__item" style="height: 44px;">
<div class="van-ellipsis">余杭区</div>
</li>
</ul>
</div>
<div class="van-picker__mask" style="background-size: 100% 88px;"></div>
@@ -127,10 +185,16 @@ exports[`renders demo correctly 1`] = `
<!---->
<div class="van-picker__columns" style="height: 220px;">
<div class="van-picker-column">
<ul class="van-picker-column__wrapper" style="transform: translate3d(0, 44px, 0); transition-duration: 0ms; transition-property: none; line-height: 44px;">
<li role="button" tabindex="-1" class="van-ellipsis van-picker-column__item van-picker-column__item--disabled" style="height: 44px;">杭州</li>
<li role="button" tabindex="0" class="van-ellipsis van-picker-column__item van-picker-column__item--selected" style="height: 44px;">宁波</li>
<li role="button" tabindex="0" class="van-ellipsis van-picker-column__item" style="height: 44px;">温州</li>
<ul class="van-picker-column__wrapper" style="transform: translate3d(0, 44px, 0); transition-duration: 0ms; transition-property: none;">
<li role="button" tabindex="-1" class="van-picker-column__item van-picker-column__item--disabled" style="height: 44px;">
<div class="van-ellipsis">杭州</div>
</li>
<li role="button" tabindex="0" class="van-picker-column__item van-picker-column__item--selected" style="height: 44px;">
<div class="van-ellipsis">宁波</div>
</li>
<li role="button" tabindex="0" class="van-picker-column__item" style="height: 44px;">
<div class="van-ellipsis">温州</div>
</li>
</ul>
</div>
<div class="van-picker__mask" style="background-size: 100% 88px;"></div>
@@ -144,18 +208,32 @@ exports[`renders demo correctly 1`] = `
<!---->
<div class="van-picker__columns" style="height: 220px;">
<div class="van-picker-column column1">
<ul class="van-picker-column__wrapper" style="transform: translate3d(0, 88px, 0); transition-duration: 0ms; transition-property: none; line-height: 44px;">
<li role="button" tabindex="0" class="van-ellipsis van-picker-column__item van-picker-column__item--selected" style="height: 44px;">浙江</li>
<li role="button" tabindex="0" class="van-ellipsis van-picker-column__item" style="height: 44px;">福建</li>
<ul class="van-picker-column__wrapper" style="transform: translate3d(0, 88px, 0); transition-duration: 0ms; transition-property: none;">
<li role="button" tabindex="0" class="van-picker-column__item van-picker-column__item--selected" style="height: 44px;">
<div class="van-ellipsis">浙江</div>
</li>
<li role="button" tabindex="0" class="van-picker-column__item" style="height: 44px;">
<div class="van-ellipsis">福建</div>
</li>
</ul>
</div>
<div class="van-picker-column column2">
<ul class="van-picker-column__wrapper" style="transform: translate3d(0, 0px, 0); transition-duration: 0ms; transition-property: none; line-height: 44px;">
<li role="button" tabindex="0" class="van-ellipsis van-picker-column__item" style="height: 44px;">杭州</li>
<li role="button" tabindex="0" class="van-ellipsis van-picker-column__item" style="height: 44px;">宁波</li>
<li role="button" tabindex="0" class="van-ellipsis van-picker-column__item van-picker-column__item--selected" style="height: 44px;">温州</li>
<li role="button" tabindex="0" class="van-ellipsis van-picker-column__item" style="height: 44px;">嘉兴</li>
<li role="button" tabindex="0" class="van-ellipsis van-picker-column__item" style="height: 44px;">湖州</li>
<ul class="van-picker-column__wrapper" style="transform: translate3d(0, 0px, 0); transition-duration: 0ms; transition-property: none;">
<li role="button" tabindex="0" class="van-picker-column__item" style="height: 44px;">
<div class="van-ellipsis">杭州</div>
</li>
<li role="button" tabindex="0" class="van-picker-column__item" style="height: 44px;">
<div class="van-ellipsis">宁波</div>
</li>
<li role="button" tabindex="0" class="van-picker-column__item van-picker-column__item--selected" style="height: 44px;">
<div class="van-ellipsis">温州</div>
</li>
<li role="button" tabindex="0" class="van-picker-column__item" style="height: 44px;">
<div class="van-ellipsis">嘉兴</div>
</li>
<li role="button" tabindex="0" class="van-picker-column__item" style="height: 44px;">
<div class="van-ellipsis">湖州</div>
</li>
</ul>
</div>
<div class="van-picker__mask" style="background-size: 100% 88px;"></div>
@@ -169,18 +247,32 @@ exports[`renders demo correctly 1`] = `
<div class="van-loading van-loading--circular van-picker__loading"><span class="van-loading__spinner van-loading__spinner--circular"><svg viewBox="25 25 50 50" class="van-loading__circular"><circle cx="50" cy="50" r="20" fill="none"></circle></svg></span></div>
<div class="van-picker__columns" style="height: 220px;">
<div class="van-picker-column column1">
<ul class="van-picker-column__wrapper" style="transform: translate3d(0, 88px, 0); transition-duration: 0ms; transition-property: none; line-height: 44px;">
<li role="button" tabindex="0" class="van-ellipsis van-picker-column__item van-picker-column__item--selected" style="height: 44px;">浙江</li>
<li role="button" tabindex="0" class="van-ellipsis van-picker-column__item" style="height: 44px;">福建</li>
<ul class="van-picker-column__wrapper" style="transform: translate3d(0, 88px, 0); transition-duration: 0ms; transition-property: none;">
<li role="button" tabindex="0" class="van-picker-column__item van-picker-column__item--selected" style="height: 44px;">
<div class="van-ellipsis">浙江</div>
</li>
<li role="button" tabindex="0" class="van-picker-column__item" style="height: 44px;">
<div class="van-ellipsis">福建</div>
</li>
</ul>
</div>
<div class="van-picker-column column2">
<ul class="van-picker-column__wrapper" style="transform: translate3d(0, 0px, 0); transition-duration: 0ms; transition-property: none; line-height: 44px;">
<li role="button" tabindex="0" class="van-ellipsis van-picker-column__item" style="height: 44px;">杭州</li>
<li role="button" tabindex="0" class="van-ellipsis van-picker-column__item" style="height: 44px;">宁波</li>
<li role="button" tabindex="0" class="van-ellipsis van-picker-column__item van-picker-column__item--selected" style="height: 44px;">温州</li>
<li role="button" tabindex="0" class="van-ellipsis van-picker-column__item" style="height: 44px;">嘉兴</li>
<li role="button" tabindex="0" class="van-ellipsis van-picker-column__item" style="height: 44px;">湖州</li>
<ul class="van-picker-column__wrapper" style="transform: translate3d(0, 0px, 0); transition-duration: 0ms; transition-property: none;">
<li role="button" tabindex="0" class="van-picker-column__item" style="height: 44px;">
<div class="van-ellipsis">杭州</div>
</li>
<li role="button" tabindex="0" class="van-picker-column__item" style="height: 44px;">
<div class="van-ellipsis">宁波</div>
</li>
<li role="button" tabindex="0" class="van-picker-column__item van-picker-column__item--selected" style="height: 44px;">
<div class="van-ellipsis">温州</div>
</li>
<li role="button" tabindex="0" class="van-picker-column__item" style="height: 44px;">
<div class="van-ellipsis">嘉兴</div>
</li>
<li role="button" tabindex="0" class="van-picker-column__item" style="height: 44px;">
<div class="van-ellipsis">湖州</div>
</li>
</ul>
</div>
<div class="van-picker__mask" style="background-size: 100% 88px;"></div>

View File

@@ -2,28 +2,56 @@
exports[`column watch default index 1`] = `
<div class="van-picker-column">
<ul class="van-picker-column__wrapper" style="transform: translate3d(0, 100px, 0); transition-duration: 0ms; transition-property: none; line-height: 50px;">
<li role="button" tabindex="-1" class="van-ellipsis van-picker-column__item van-picker-column__item--disabled van-picker-column__item--selected" style="height: 50px;">1</li>
<li role="button" tabindex="0" class="van-ellipsis van-picker-column__item" style="height: 50px;">1990</li>
<li role="button" tabindex="0" class="van-ellipsis van-picker-column__item" style="height: 50px;">1991</li>
<li role="button" tabindex="0" class="van-ellipsis van-picker-column__item" style="height: 50px;">1992</li>
<li role="button" tabindex="0" class="van-ellipsis van-picker-column__item" style="height: 50px;">1993</li>
<li role="button" tabindex="0" class="van-ellipsis van-picker-column__item" style="height: 50px;">1994</li>
<li role="button" tabindex="0" class="van-ellipsis van-picker-column__item" style="height: 50px;">1995</li>
<ul class="van-picker-column__wrapper" style="transform: translate3d(0, 100px, 0); transition-duration: 0ms; transition-property: none;">
<li role="button" tabindex="-1" class="van-picker-column__item van-picker-column__item--disabled van-picker-column__item--selected" style="height: 50px;">
<div class="van-ellipsis"></div>
</li>
<li role="button" tabindex="0" class="van-picker-column__item" style="height: 50px;">
<div class="van-ellipsis"></div>
</li>
<li role="button" tabindex="0" class="van-picker-column__item" style="height: 50px;">
<div class="van-ellipsis"></div>
</li>
<li role="button" tabindex="0" class="van-picker-column__item" style="height: 50px;">
<div class="van-ellipsis"></div>
</li>
<li role="button" tabindex="0" class="van-picker-column__item" style="height: 50px;">
<div class="van-ellipsis"></div>
</li>
<li role="button" tabindex="0" class="van-picker-column__item" style="height: 50px;">
<div class="van-ellipsis"></div>
</li>
<li role="button" tabindex="0" class="van-picker-column__item" style="height: 50px;">
<div class="van-ellipsis"></div>
</li>
</ul>
</div>
`;
exports[`column watch default index 2`] = `
<div class="van-picker-column">
<ul class="van-picker-column__wrapper" style="transform: translate3d(0, 0px, 0); transition-duration: 0ms; transition-property: none; line-height: 50px;">
<li role="button" tabindex="-1" class="van-ellipsis van-picker-column__item van-picker-column__item--disabled" style="height: 50px;">1</li>
<li role="button" tabindex="0" class="van-ellipsis van-picker-column__item" style="height: 50px;">1990</li>
<li role="button" tabindex="0" class="van-ellipsis van-picker-column__item van-picker-column__item--selected" style="height: 50px;">1991</li>
<li role="button" tabindex="0" class="van-ellipsis van-picker-column__item" style="height: 50px;">1992</li>
<li role="button" tabindex="0" class="van-ellipsis van-picker-column__item" style="height: 50px;">1993</li>
<li role="button" tabindex="0" class="van-ellipsis van-picker-column__item" style="height: 50px;">1994</li>
<li role="button" tabindex="0" class="van-ellipsis van-picker-column__item" style="height: 50px;">1995</li>
<ul class="van-picker-column__wrapper" style="transform: translate3d(0, 0px, 0); transition-duration: 0ms; transition-property: none;">
<li role="button" tabindex="-1" class="van-picker-column__item van-picker-column__item--disabled" style="height: 50px;">
<div class="van-ellipsis"></div>
</li>
<li role="button" tabindex="0" class="van-picker-column__item" style="height: 50px;">
<div class="van-ellipsis"></div>
</li>
<li role="button" tabindex="0" class="van-picker-column__item van-picker-column__item--selected" style="height: 50px;">
<div class="van-ellipsis"></div>
</li>
<li role="button" tabindex="0" class="van-picker-column__item" style="height: 50px;">
<div class="van-ellipsis"></div>
</li>
<li role="button" tabindex="0" class="van-picker-column__item" style="height: 50px;">
<div class="van-ellipsis"></div>
</li>
<li role="button" tabindex="0" class="van-picker-column__item" style="height: 50px;">
<div class="van-ellipsis"></div>
</li>
<li role="button" tabindex="0" class="van-picker-column__item" style="height: 50px;">
<div class="van-ellipsis"></div>
</li>
</ul>
</div>
`;
@@ -33,7 +61,7 @@ exports[`columns-top、columns-bottom prop 1`] = `
<div class="van-hairline--top-bottom van-picker__toolbar"><button type="button" class="van-picker__cancel">取消</button><button type="button" class="van-picker__confirm">确认</button></div>
<!---->Custom Columns Top<div class="van-picker__columns" style="height: 220px;">
<div class="van-picker-column">
<ul class="van-picker-column__wrapper" style="transform: translate3d(0, 88px, 0); transition-duration: 0ms; transition-property: none; line-height: 44px;"></ul>
<ul class="van-picker-column__wrapper" style="transform: translate3d(0, 88px, 0); transition-duration: 0ms; transition-property: none;"></ul>
</div>
<div class="van-picker__mask" style="background-size: 100% 88px;"></div>
<div class="van-hairline-unset--top-bottom van-picker__frame" style="height: 44px;"></div>
@@ -47,8 +75,10 @@ exports[`not allow html 1`] = `
<!---->
<div class="van-picker__columns" style="height: 220px;">
<div class="van-picker-column">
<ul class="van-picker-column__wrapper" style="transform: translate3d(0, 88px, 0); transition-duration: 0ms; transition-property: none; line-height: 44px;">
<li role="button" tabindex="0" class="van-ellipsis van-picker-column__item van-picker-column__item--selected" style="height: 44px;">&lt;div&gt;option&lt;/div&gt;</li>
<ul class="van-picker-column__wrapper" style="transform: translate3d(0, 88px, 0); transition-duration: 0ms; transition-property: none;">
<li role="button" tabindex="0" class="van-picker-column__item van-picker-column__item--selected" style="height: 44px;">
<div class="van-ellipsis"></div>
</li>
</ul>
</div>
<div class="van-picker__mask" style="background-size: 100% 88px;"></div>
@@ -64,7 +94,7 @@ exports[`render title slot 1`] = `
<!---->
<div class="van-picker__columns" style="height: 220px;">
<div class="van-picker-column">
<ul class="van-picker-column__wrapper" style="transform: translate3d(0, 88px, 0); transition-duration: 0ms; transition-property: none; line-height: 44px;"></ul>
<ul class="van-picker-column__wrapper" style="transform: translate3d(0, 88px, 0); transition-duration: 0ms; transition-property: none;"></ul>
</div>
<div class="van-picker__mask" style="background-size: 100% 88px;"></div>
<div class="van-hairline-unset--top-bottom van-picker__frame" style="height: 44px;"></div>
@@ -79,7 +109,7 @@ exports[`toolbar-position prop 1`] = `
<!---->
<div class="van-picker__columns" style="height: 220px;">
<div class="van-picker-column">
<ul class="van-picker-column__wrapper" style="transform: translate3d(0, 88px, 0); transition-duration: 0ms; transition-property: none; line-height: 44px;"></ul>
<ul class="van-picker-column__wrapper" style="transform: translate3d(0, 88px, 0); transition-duration: 0ms; transition-property: none;"></ul>
</div>
<div class="van-picker__mask" style="background-size: 100% 88px;"></div>
<div class="van-hairline-unset--top-bottom van-picker__frame" style="height: 44px;"></div>