[Vuejs]-Don't watch a data item in a Vue component

4👍

Combine all the properties you want to watch into a computed property, then watch the computed property

data: function() {
    return {
        'orderBy': 'date_published:desc',
        'page': 1,
        'posts': []
    }
},

computed: {
    controls(){
        return {
            orderBy: this.orderBy,
            page: this.page
        }
    }
},
watch:{
    controls(){
        this.loadPosts()
    }
},
methods: {
    loadPosts: function() {
        // code to AJAX in data
        this.posts = response.data;
    }
}

Leave a comment