Vue JS 将递增的数字保存到 Firebase 数据库

Question

我有一个与 Firebase JSON 数据库一起使用的简单 VueJS 应用程序。我希望能够单击箭头来更新评论的 "votes"。（类似于该网站的投票方式）。我的功能运行。但是 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
    },

})

Answer 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
},

Vue JS 将递增的数字保存到 Firebase 数据库

Vue JS save incremented number to Firebase database

javascript

firebase

vue.js

firebase-realtime-database

vuefire