0

我有一个与 Firebase JSON 数据库一起使用的简单 VueJS 应用程序。我希望能够单击箭头来更新评论的“投票”。（类似于本网站的投票方式）。我的功能运行。但是 Vue 模型从不更新 Firebase，因此刷新时会丢失投票计数。请参考我的 CodePen：http ://codepen.io/Auzy/pen/evowdd/ （请注意，我使用 Pug 和 Stylus，要查看正常的 HTML/CSS，请单击右上角的箭头。）

JS：

// Initialize Firebase
var config = {
    databaseURL: "..."
};
const firebaseapp = firebase.initializeApp(config);
const db = firebaseapp.database();
const commentsRef = db.ref('test');

const app = new Vue({
    el: '#app',
    data: {
        comments: [],
        newComment: {
            name: '',
            comment: '',
            votes: 0
        },
    },
    methods: {
        addComment() {
            commentsRef.push(this.newComment);
            this.newComment.name = '';
            this.newComment.message = '';
            this.newComment.votes = 0;
        },
        vote: function (voteType, comment) {
            if (voteType === "up") {
                comment.votes++
            } else if (voteType === "down") {
                if (comment.votes <= -10) {
                    return;
                }

                comment.votes--;
            }
        },
    },
    firebase: {
        comments: commentsRef
    },

})
4

1 回答 1

1

好吧，我相信我已经想通了。如果您有更好的方法，请回答。

这是添加了注释的新方法：

incrementVote(comment) {
    comment.votes++ //increment the vote count
    const businesschildKey = comment['.key']; //get key of modified comment
    delete comment['.key']; //Firebase doesn't know how to handle them but can use VueFire to get around that.
    this.$firebaseRefs.comments.child(businesschildKey).set(comment) //Updates Firebase record matching key
},
于 2017-04-06T03:36:28.297 回答