[new feature] Notify: add onClick event

This commit is contained in:
陈嘉涵 2019-05-01 09:17:59 +08:00
parent 848786dd6e
commit 210122d518
8 changed files with 34 additions and 3 deletions

View File

@ -63,6 +63,10 @@
- 新增`text-size`属性
- 支持`Number`类型的`size`属性
### Notify
- 新增`onClick`属性
### NoticeBar
- 新增`left-icon`插槽

View File

@ -41,6 +41,9 @@ function Notify(
onInput={(value: boolean) => {
emit(ctx, 'input', value);
}}
onClick={(event: Event) => {
emit(ctx, 'click', event);
}}
{...inherit(ctx)}
>
{props.message}

View File

@ -42,7 +42,8 @@ export default {
this.$notify({
message: this.$t('content'),
duration: 1000,
background: '#1989fa'
background: '#1989fa',
onClick: () => this.$toast('click!!!')
});
}
}

View File

@ -56,3 +56,4 @@ export default {
| color | Message color | `String` | `#fff` | |
| background | Background color | `String` | `#f44` |
| className | Custom className | `String | Array | Object` | - |
| onClick | Click callback | `Function` | - |

View File

@ -19,7 +19,15 @@ function Notify(options: NotifyOptions) {
}
if (!instance) {
instance = mount(VanNotify);
instance = mount(VanNotify, {
on: {
click(event: Event) {
if (instance.onClick) {
instance.onClick(event);
}
}
}
});
}
options = {
@ -44,7 +52,8 @@ function defaultOptions(): NotifyOptions {
color: WHITE,
background: RED,
duration: 3000,
className: ''
className: '',
onClick: null
};
}

View File

@ -47,3 +47,14 @@ test('set default options', () => {
expect(Notify().duration).toEqual(3000);
Notify.clear();
});
test('onClick prop', async () => {
const onClick = jest.fn();
const notify = Notify({
message: 'test',
onClick
});
notify.$el.click();
expect(onClick).toHaveBeenCalled();
});

View File

@ -55,3 +55,4 @@ export default {
| color | 字体颜色 | `String` | `#fff` | 1.4.7 |
| background | 背景颜色 | `String` | `#f44` | 1.4.7 |
| className | 自定义类名 | `String | Array | Object` | - | 1.6.0 |
| onClick | 点击时的回调函数 | `Function` | - | 2.0.0 |

1
types/notify.d.ts vendored
View File

@ -9,6 +9,7 @@ export type NotifyOptions = {
duration?: number;
className?: any;
background?: string;
onClick?: ((event: Event) => void) | null;
}
export interface VanNotify extends Vue {