[new feature] Toast: add new option onClose & add new slot

fix #1185
fix #1551

pull request 改动点:

- add new option onClose
- add new slot
This commit is contained in:
rex 2019-04-22 16:57:26 +08:00 committed by GitHub
parent cbf646ea20
commit 66e2233e54
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 32 additions and 28 deletions

View File

@ -105,3 +105,10 @@ const timer = setInterval(() => {
| duration | 展示时长(ms),值为 0 时toast 不会消失 | `Number` | `3000` |
| selector | 自定义选择器 | `String` | `van-toast` |
| context | 选择器的选择范围,可以传入自定义组件的 this 作为上下文 | `Object` | 当前页面 |
| onClose | 关闭时的回调函数 | `Function` | - |
### Slot
| 名称 | 说明 |
|-----------|-----------|
| - | 自定义内容 |

View File

@ -25,12 +25,6 @@ VantComponent({
},
methods: {
clear() {
this.set({
show: false
});
},
// for prevent touchmove
noop() {}
}

View File

@ -27,5 +27,7 @@
<van-icon wx:else class="van-toast__icon" name="{{ type }}" />
<text wx:if="{{ message }}" class="van-toast__text">{{ message }}</text>
</block>
<slot />
</view>
</van-transition>

View File

@ -2,7 +2,7 @@ import { isObj } from '../common/utils';
type ToastMessage = string | number;
export type ToastOptions = {
interface ToastOptions {
show?: boolean;
type?: string;
mask?: boolean;
@ -14,16 +14,7 @@ export type ToastOptions = {
forbidClick?: boolean;
loadingType?: string;
message?: ToastMessage;
}
export interface Toast {
(message: ToastOptions | ToastMessage, options?: ToastOptions): Weapp.Component;
loading?(options?: ToastOptions | ToastMessage): Weapp.Component;
success?(options?: ToastOptions | ToastMessage): Weapp.Component;
fail?(options?: ToastOptions | ToastMessage): Weapp.Component;
clear?(): void;
setDefaultOptions?(options: ToastOptions): void;
resetDefaultOptions?(): void;
onClose?: () => void;
}
const defaultOptions = {
@ -51,10 +42,10 @@ function getContext() {
return pages[pages.length - 1];
}
const Toast: Toast = (options = {}) => {
options = {
function Toast(toastOptions: ToastOptions | ToastMessage): Weapp.Component {
const options = {
...currentOptions,
...parseOptions(options)
...parseOptions(toastOptions)
} as ToastOptions;
const context = options.context || getContext();
@ -68,6 +59,14 @@ const Toast: Toast = (options = {}) => {
delete options.context;
delete options.selector;
toast.clear = () => {
toast.set({ show: false });
if (options.onClose) {
options.onClose();
}
};
queue.push(toast);
toast.set(options);
clearTimeout(toast.timer);
@ -80,15 +79,17 @@ const Toast: Toast = (options = {}) => {
}
return toast;
};
}
const createMethod = type => options => Toast({
type, ...parseOptions(options)
});
const createMethod = type => (options: ToastOptions | ToastMessage) =>
Toast({
type,
...parseOptions(options)
});
['loading', 'success', 'fail'].forEach(method => {
Toast[method] = createMethod(method);
});
Toast.loading = createMethod('loading');
Toast.success = createMethod('success');
Toast.fail = createMethod('fail');
Toast.clear = () => {
queue.forEach(toast => {
@ -97,7 +98,7 @@ Toast.clear = () => {
queue = [];
};
Toast.setDefaultOptions = options => {
Toast.setDefaultOptions = (options: ToastOptions) => {
Object.assign(currentOptions, options);
};