[Vuejs]-Vue.js "Watch" not firing on simple boolean value change

by

0👍

✅

There is no such thing as a “watch” in a store, as Bert alluded to in the comments.

There are two different approaches that you can take to simulate this behavior, depending on your needs and your architecture.

One, you can watch the store’s getters in your component and respond to it there:

watch: {
    `$store.getters.warningSwitch`: function (newState, oldState) {
        /* console.log(" Triggered "); */
        if(newState){
            this.showWarningNotice({title: "Oops", text:"Connection Lost"});
            return;
        } else {
            this.showInfoNotice({title: "Whew...", text:"Connected"});
        }
    }
},

Two, you can actually dispatch additional behavior in the action of the store:

actions: {
    setWarningOn: function(context, newState) {
        // broadcast event here or commit another mutation   
    }
}
👤David L

Leave a comment