alighasami/vant
1
0
Fork 0
Code Issues Pull Requests Actions 2 Packages Projects Releases Wiki Activity

feat(Picker): add option slot (#7380)

Browse Source
This commit is contained in:
neverland
2020-10-21 21:52:12 +08:00
committed by GitHub
parent 7ec560fc82
commit ea210bb013
6 changed files with 91 additions and 18 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/picker/test/__snapshots__/index.spec.js.snap
+36
View File
@@ -103,6 +103,42 @@ exports[`render confirm/cancel slot 1`] = `
</div>
`;
exports[`render option slot with object columns 1`] = `
<div class="van-picker">
<div class="van-picker__toolbar"><button type="button" class="van-picker__cancel">取消</button><button type="button" class="van-picker__confirm">确认</button></div>
<!---->
<div class="van-picker__columns" style="height: 264px;">
<div class="van-picker-column">
<ul class="van-picker-column__wrapper" style="transform: translate3d(0, 110px, 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;">foo</li>
<li role="button" tabindex="0" class="van-picker-column__item" style="height: 44px;">bar</li>
</ul>
</div>
<div class="van-picker__mask" style="background-size: 100% 110px;"></div>
<div class="van-hairline-unset--top-bottom van-picker__frame" style="height: 44px;"></div>
</div>
<!---->
</div>
`;
exports[`render option slot with simple columns 1`] = `
<div class="van-picker">
<div class="van-picker__toolbar"><button type="button" class="van-picker__cancel">取消</button><button type="button" class="van-picker__confirm">确认</button></div>
<!---->
<div class="van-picker__columns" style="height: 264px;">
<div class="van-picker-column">
<ul class="van-picker-column__wrapper" style="transform: translate3d(0, 110px, 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;">foo</li>
<li role="button" tabindex="0" class="van-picker-column__item" style="height: 44px;">bar</li>
</ul>
</div>
<div class="van-picker__mask" style="background-size: 100% 110px;"></div>
<div class="van-hairline-unset--top-bottom van-picker__frame" style="height: 44px;"></div>
</div>
<!---->
</div>
`;
exports[`render title slot 1`] = `
<div class="van-picker">
<div class="van-picker__toolbar"><button type="button" class="van-picker__cancel">取消</button>Custom title<button type="button" class="van-picker__confirm">确认</button></div>
src/picker/test/index.spec.js
+32
View File
@@ -160,6 +160,38 @@ test('render confirm/cancel slot', () => {
expect(wrapper).toMatchSnapshot();
});
test('render option slot with simple columns', () => {
const wrapper = mount({
template: `
<van-picker :columns="columns" show-toolbar>
<template #option="item">{{ item }}</template>
</van-picker>
`,
data() {
return { columns: ['foo', 'bar'] };
},
});
expect(wrapper).toMatchSnapshot();
});
test('render option slot with object columns', () => {
const wrapper = mount({
template: `
<van-picker :columns="columns" show-toolbar>
<template #option="item">{{ item.text }}</template>
</van-picker>
`,
data() {
return {
columns: [{ text: 'foo' }, { text: 'bar' }],
};
},
});
expect(wrapper).toMatchSnapshot();
});
test('simulation finger swipe again before transitionend', () => {
// mock getComputedStyle
// see: https://github.com/jsdom/jsdom/issues/2588