Question

我正在使用JS [ES6]，我可以随时随地显示通知，点击x图标，＆＃39; s消失得很好，但如果我让它timeout它会抛出Type Error

Notify.js?49da:72 Uncaught TypeError: Cannot read property 'stop' of undefined

这是我的class代码段

class Notify {
    constructor() {
        this.html = '';
    }

    showNotification(text = 'Something went wrong!', style = 'warning'){
        //here I need to update this.html
        this.html = $(`<div class="alert  alert-${style}  hide">${this.icon}  ${text} </div>`);

        //close on click
        let vue = this;
        $('<a>', {
            text: '×',
            class: 'button close',
            style: 'padding-left: 10px;',
            href: '#',
            click: function (e) {
                e.preventDefault();
                vue.removeNotice();
            }
        }).prependTo(vue.html);
        vue.container.prepend(vue.html);
        vue.html.removeClass('hide').hide().fadeIn('slow');
        var timer = setInterval(vue.removeNotice, vue.time);

        $(vue.html).hover(function () {
            clearInterval(timer);
        }, function () {
            timer = setInterval(vue.removeNotice, vue.time);
        });

        vue.html.on('click', function () {
            clearInterval(timer);
            vue.removeNotice()
        });

    }

    removeNotice() {
        console.dir(this.html);  //this just prints empty string
        this.html.stop().fadeOut('slow').remove()  //this line throws error.
    }

任何线索在哪里以及我做错了什么？ P.S我正在学习这些东西。和downvoter请指向正确的方向

Answer 1

你没有正确绑定它。

  timer = setInterval(vue.removeNotice.bind(this), vue.time);

应该做的伎俩。

未捕获的TypeError：无法读取属性＆＃39;停止＆＃39;未定义的

1 个答案: