mirror of
https://gitee.com/vant-contrib/vant.git
synced 2025-04-06 03:57:59 +08:00
[new feature] Popup: add click event
This commit is contained in:
parent
ef77166246
commit
848786dd6e
@ -53,6 +53,10 @@
|
|||||||
|
|
||||||
- 新增`Skeleton`骨架屏组件
|
- 新增`Skeleton`骨架屏组件
|
||||||
|
|
||||||
|
### Popup
|
||||||
|
|
||||||
|
- 新增`click`事件
|
||||||
|
|
||||||
### Loading
|
### Loading
|
||||||
|
|
||||||
- 新增`default`插槽
|
- 新增`default`插槽
|
||||||
|
@ -54,6 +54,7 @@ Use `position` prop to set popup display position
|
|||||||
|
|
||||||
| Event | Description | Arguments |
|
| Event | Description | Arguments |
|
||||||
|------|------|------|
|
|------|------|------|
|
||||||
|
| click | Triggered when click Popup | - |
|
||||||
| open | Triggered when open Popup | - |
|
| open | Triggered when open Popup | - |
|
||||||
| opened | Triggered when opened Popup | - |
|
| opened | Triggered when opened Popup | - |
|
||||||
| close | Triggered when close Popup | - |
|
| close | Triggered when close Popup | - |
|
||||||
|
@ -25,7 +25,7 @@ export default sfc({
|
|||||||
}
|
}
|
||||||
|
|
||||||
const { position } = this;
|
const { position } = this;
|
||||||
const emit = event => () => this.$emit(event);
|
const emit = eventName => event => this.$emit(eventName, event);
|
||||||
const transitionName = this.transition || (position ? `van-popup-slide-${position}` : 'van-fade');
|
const transitionName = this.transition || (position ? `van-popup-slide-${position}` : 'van-fade');
|
||||||
|
|
||||||
return (
|
return (
|
||||||
@ -34,7 +34,7 @@ export default sfc({
|
|||||||
onAfterEnter={emit('opened')}
|
onAfterEnter={emit('opened')}
|
||||||
onAfterLeave={emit('closed')}
|
onAfterLeave={emit('closed')}
|
||||||
>
|
>
|
||||||
<div vShow={this.value} class={bem({ [position]: position })}>
|
<div vShow={this.value} class={bem({ [position]: position })} onClick={emit('click')}>
|
||||||
{this.slots()}
|
{this.slots()}
|
||||||
</div>
|
</div>
|
||||||
</transition>
|
</transition>
|
||||||
|
@ -171,10 +171,21 @@ test('close on click modal', () => {
|
|||||||
expect(wrapper.vm.value).toBeFalsy();
|
expect(wrapper.vm.value).toBeFalsy();
|
||||||
});
|
});
|
||||||
|
|
||||||
test('oepn & close event', () => {
|
test('open & close event', () => {
|
||||||
wrapper = mount(Popup);
|
const wrapper = mount(Popup);
|
||||||
wrapper.vm.value = true;
|
wrapper.vm.value = true;
|
||||||
expect(wrapper.emitted('open')).toBeTruthy();
|
expect(wrapper.emitted('open')).toBeTruthy();
|
||||||
wrapper.vm.value = false;
|
wrapper.vm.value = false;
|
||||||
expect(wrapper.emitted('close')).toBeTruthy();
|
expect(wrapper.emitted('close')).toBeTruthy();
|
||||||
});
|
});
|
||||||
|
|
||||||
|
test('click event', () => {
|
||||||
|
const wrapper = mount(Popup, {
|
||||||
|
propsData: {
|
||||||
|
value: true
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
wrapper.trigger('click');
|
||||||
|
expect(wrapper.emitted('click')).toBeTruthy();
|
||||||
|
});
|
||||||
|
@ -54,6 +54,7 @@ export default {
|
|||||||
|
|
||||||
| 事件名 | 说明 | 回调参数 |
|
| 事件名 | 说明 | 回调参数 |
|
||||||
|------|------|------|
|
|------|------|------|
|
||||||
|
| click | 点击弹出层时触发 | - |
|
||||||
| open | 打开弹出层时触发 | - |
|
| open | 打开弹出层时触发 | - |
|
||||||
| opened | 打开弹出层且动画结束后触发 | - |
|
| opened | 打开弹出层且动画结束后触发 | - |
|
||||||
| close | 关闭弹出层时触发 | - |
|
| close | 关闭弹出层时触发 | - |
|
||||||
|
Loading…
x
Reference in New Issue
Block a user