antd-mini/less/Toast/index.js

antd-mini 是支付宝小程序 UI 组件库，遵循 Ant Design 规范。

import { Component, getValueFromProps, triggerEventOnly, } from '../_util/simply';
import { ToastDefaultProps } from './props';
Component({
    props: ToastDefaultProps,
    data: {
        show: false,
    },
    timer: null,
    methods: {
        closeMask: function () {
            if (this.timer) {
                clearTimeout(this.timer);
            }
            this.setData({ show: false });
            this.timer = null;
            triggerEventOnly(this, 'close');
        },
        handleShowToast: function () {
            var _this = this;
            this.setData({ show: true });
            var duration = getValueFromProps(this, 'duration');
            if (duration > 0) {
                var timer = setTimeout(function () {
                    _this.closeMask();
                }, duration);
                this.timer = timer;
            }
        },
        handleClickMask: function () {
            var _a = getValueFromProps(this, [
                'showMask',
                'maskCloseable',
            ]), showMask = _a[0], maskCloseable = _a[1];
            if (showMask && maskCloseable) {
                this.closeMask();
            }
        },
    },
    didUpdate: function (prev) {
        var visible = getValueFromProps(this, 'visible');
        if (!prev.visible && visible) {
            this.handleShowToast();
        }
        else if (!visible && this.data.show) {
            this.closeMask();
        }
    },
    didMount: function () {
        var visible = getValueFromProps(this, 'visible');
        if (visible) {
            this.handleShowToast();
        }
    },
});