feat(Pagination): pagination item custom render (#7222)

* feat(Pagination): pagination item custom render

* fix(Pagination): fix test result

* fix(Pagination): expose page object directly
This commit is contained in:
JSparow
2020-09-22 19:10:43 +08:00
committed by GitHub
parent 1eca65d05b
commit 106114333b
7 changed files with 135 additions and 3 deletions
@@ -30,5 +30,18 @@ exports[`renders demo correctly 1`] = `
<li class="van-pagination__item van-pagination__next van-hairline">下一页</li>
</ul>
</div>
<div>
<ul class="van-pagination">
<li class="van-pagination__item van-pagination__item--disabled van-pagination__prev van-hairline"><i class="van-icon van-icon-arrow-left">
<!----></i></li>
<li class="van-pagination__item van-pagination__item--active van-pagination__page van-hairline">1</li>
<li class="van-pagination__item van-pagination__page van-hairline">2</li>
<li class="van-pagination__item van-pagination__page van-hairline">3</li>
<li class="van-pagination__item van-pagination__page van-hairline">4</li>
<li class="van-pagination__item van-pagination__page van-hairline">5</li>
<li class="van-pagination__item van-pagination__next van-hairline"><i class="van-icon van-icon-arrow">
<!----></i></li>
</ul>
</div>
</div>
`;
@@ -0,0 +1,25 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`render page slot 1`] = `
<ul class="van-pagination">
<li class="van-pagination__item van-pagination__prev van-hairline">上一页</li>
<li class="van-pagination__item van-pagination__page van-hairline">1</li>
<li class="van-pagination__item van-pagination__page van-hairline">2</li>
<li class="van-pagination__item van-pagination__page van-hairline">3</li>
<li class="van-pagination__item van-pagination__page van-hairline">4</li>
<li class="van-pagination__item van-pagination__page van-hairline">5</li>
<li class="van-pagination__item van-pagination__next van-hairline">下一页</li>
</ul>
`;
exports[`render prev-text & next-text slot 1`] = `
<ul class="van-pagination">
<li class="van-pagination__item van-pagination__prev van-hairline">Custom PrevText</li>
<li class="van-pagination__item van-pagination__page van-hairline">1</li>
<li class="van-pagination__item van-pagination__page van-hairline">2</li>
<li class="van-pagination__item van-pagination__page van-hairline">3</li>
<li class="van-pagination__item van-pagination__page van-hairline">4</li>
<li class="van-pagination__item van-pagination__page van-hairline">5</li>
<li class="van-pagination__item van-pagination__next van-hairline">Custom NextText</li>
</ul>
`;
+31
View File
@@ -0,0 +1,31 @@
import { mount } from '../../../test';
import Paginaion from '..'
test('render prev-text & next-text slot', () => {
const wrapper = mount(Paginaion, {
propsData: {
totalItems: 50,
showPageSize: 5
},
scopedSlots: {
'prev-text': () => 'Custom PrevText',
'next-text': () => 'Custom NextText',
}
});
expect(wrapper).toMatchSnapshot();
});
test('render page slot', () => {
const wrapper = mount(Paginaion, {
propsData: {
totalItems: 50,
showPageSize: 5
},
scopedSlots: {
'page': ({ text }) => `${text}`,
}
});
expect(wrapper).toMatchSnapshot();
});