DOM is not updating when props value changes in Vuejs DOM is not updating when props value changes in Vuejs vue.js vue.js

DOM is not updating when props value changes in Vuejs


You are only setting the child component's variable in the created hook, therefor they are not reactive.

The best way is to make a reactive data based on the prop is to create a computed property based on that property :

computed: {  category: function() {    return this.catsgory;  },},

This computed will be automatically updated whenever the props changes.

You also can watch the prop directly, and force the watcher to trigger immediately (take a look at the the API).

Your child component's watcher will look like this :

watch : {  category: {    handler: function() {        this.GetProducts();    },    immediate: true,  },},


In my case, If initial props value(array) is undefind, even if props change, render was not fired.

So I changed inital props value to empty array []

Then problem solved.