[Vuejs]-Vue.js ajax request one step behind

2👍

The problem is that you are calling two async functions without callbacks or promises in your addNewComment in your Vue code. This piece of code

addNewComment: function () {
    var comment = this.newComment

    this.newComment = { reply:'',user_id:'',
    topic_id:'' }
    this.$http.post('/api/comments/', comment)
    this.fetchComment(topic_id)

Should be like this

addNewComment: function () {
    var comment = this.newComment

    this.newComment = { reply:'',user_id:'',
    topic_id:'' }
    this.$http.post('/api/comments/', comment).then(function (response) {
        // should your topic_id var be defined here? 
        // that's also a problem if it is undefined
        this.fetchComment(topic_id)
    })

Other thing, I don’t know why you are using the $set method in the $get call on fetchComment methods, it is not necesary, because your comments are already defined in the data atribute of your Vue instance, so just use this.comments = data['data']

Leave a comment