mirror of
https://gitee.com/vant-contrib/vant.git
synced 2025-04-06 03:57:59 +08:00
feat(Swipe): indicator slot add total param (#10060)
* feat(Swipe): indicator slot add total param * test: indicator slot
This commit is contained in:
parent
be7a08bd20
commit
92fb70d6e8
@ -206,10 +206,10 @@ swipeRef.value?.next();
|
||||
|
||||
### Swipe Slots
|
||||
|
||||
| Name | Description | SlotProps |
|
||||
| ------------------- | ---------------- | -------------------- |
|
||||
| default | Content | - |
|
||||
| indicator `v3.0.16` | Custom indicator | _{ active: number }_ |
|
||||
| Name | Description | SlotProps |
|
||||
| ------------------ | ---------------- | ----------------------------------- |
|
||||
| default | Content | - |
|
||||
| indicator `v3.3.8` | Custom indicator | _{ active: number, total: number }_ |
|
||||
|
||||
## Theming
|
||||
|
||||
|
@ -214,10 +214,10 @@ swipeRef.value?.next();
|
||||
|
||||
### Swipe Slots
|
||||
|
||||
| 名称 | 说明 | 参数 |
|
||||
| ------------------- | ------------ | -------------------- |
|
||||
| default | 轮播内容 | - |
|
||||
| indicator `v3.0.16` | 自定义指示器 | _{ active: number }_ |
|
||||
| 名称 | 说明 | 参数 |
|
||||
| ------------------ | ------------ | ----------------------------------- |
|
||||
| default | 轮播内容 | - |
|
||||
| indicator `v3.3.8` | 自定义指示器 | _{ active: number, total: number }_ |
|
||||
|
||||
## 主题定制
|
||||
|
||||
|
@ -384,6 +384,7 @@ export default defineComponent({
|
||||
if (slots.indicator) {
|
||||
return slots.indicator({
|
||||
active: activeIndicator.value,
|
||||
total: count.value,
|
||||
});
|
||||
}
|
||||
if (props.showIndicators && count.value > 1) {
|
||||
|
@ -76,6 +76,28 @@ exports[`should render dynamic SwipeItem correctly 2`] = `
|
||||
</div>
|
||||
`;
|
||||
|
||||
exports[`should render indicator slot correctly 1`] = `
|
||||
<div class="van-swipe"
|
||||
style="width: 100px; height: 100px;"
|
||||
>
|
||||
<div style="transition-duration: 0ms; transform: translateX(0px); width: 200px;"
|
||||
class="van-swipe__track"
|
||||
>
|
||||
<div class="van-swipe-item"
|
||||
style="width: 100px;"
|
||||
>
|
||||
1
|
||||
</div>
|
||||
<div class="van-swipe-item"
|
||||
style="width: 100px;"
|
||||
>
|
||||
2
|
||||
</div>
|
||||
</div>
|
||||
active: 0, total: 2
|
||||
</div>
|
||||
`;
|
||||
|
||||
exports[`should render initial swipe correctly 1`] = `
|
||||
<div class="van-swipe"
|
||||
style="width: 100px; height: 100px;"
|
||||
|
@ -309,3 +309,25 @@ test('should render dynamic SwipeItem correctly', async () => {
|
||||
await later();
|
||||
expect(wrapper.html()).toMatchSnapshot();
|
||||
});
|
||||
|
||||
test('should render indicator slot correctly', async () => {
|
||||
const wrapper = mount({
|
||||
render() {
|
||||
return (
|
||||
<Swipe
|
||||
v-slots={{
|
||||
indicator: ({ active, total }) =>
|
||||
`active: ${active}, total: ${total}`,
|
||||
}}
|
||||
style={swipeStyle}
|
||||
>
|
||||
<SwipeItem>1</SwipeItem>
|
||||
<SwipeItem>2</SwipeItem>
|
||||
</Swipe>
|
||||
);
|
||||
},
|
||||
});
|
||||
|
||||
await later();
|
||||
expect(wrapper.html()).toMatchSnapshot();
|
||||
});
|
||||
|
Loading…
x
Reference in New Issue
Block a user