Question

我的项目基于friendlypix-web，我希望允许用户编辑帖子的文本，就像他们已经可以编辑评论一样。我在FirebaseHelper.js中创建了一个方法来实现这一点。

下面的代码使用window.prompt（）起作用（请参见注释部分）。但是我想使用SweetAlert2，它允许textarea帮助更长的字幕和注释。

这是我的代码：

_setupEditButton(postId, author = {}, imageText) {
    const post = this.postElement;

    if (this.auth.currentUser && this.auth.currentUser.uid === author.uid) {
        post.addClass('fp-owned-post');
    } else {
        post.removeClass('fp-owned-post');
    }

    $('.fp-edit-post', post).click(() => {

//       const newPost = window.prompt('Edit the post?', imageText);
//        if (newPost !== null && newPost !== '') {
//            this.firebaseHelper.editPost(postId, newPost).then(() => {
//              $('.fp-first-comment .fp-text', post).text(newPost);
//            });
//        }

        swal({
            title: 'Edit post',
            showCancelButton: true,
            input: 'textarea',  // sweetalert2 allows textarea
            inputValue: imageText,
            reverseButtons: true,

        }).then(function(result) {

            const newPost = result;

            if (newPost !== null && newPost !== '') {
                try {
                    this.firebaseHelper.editPost(postId, newPost).then(() => {
                        $('.fp-first-comment .fp-text', post).text(newPost);
                    });
                } catch (e) {
                    console.log(e);
                }
            }
        });
    });
}

可悲的是，我对JavaScript的微弱理解导致

TypeError: Cannot read property 'firebaseHelper' of undefined

为什么在swal（）版本中而不是window.prompt（）中未定义“ this”？

Answer 1

这是因为回调函数中的this是指该函数，而不是函数外部的对象。

最简单的更改是将函数绑定到this的正确含义上：

.then(function(result) {

    const newPost = result;

    if (newPost !== null && newPost !== '') {
        try {
            this.firebaseHelper.editPost(postId, newPost).then(() => {
                $('.fp-first-comment .fp-text', post).text(newPost);
            });
        } catch (e) {
            console.log(e);
        }
    }
}).bind(this);

但我强烈建议在此处阅读更多解决方案和解释：

How to access the correct `this` inside a callback?

Friendlypix-web：firebaseHelper未定义

1 个答案: