How to watch for changes on the "revert" button?

I need to call a JS function when the user clicks the “revert” button (on any content entry). Any ideas on how to achieve this?

I’ve found the content/hasChanges vuex store. My thinking is to add a watcher to this value.

My initial thought was to do this:

// Note: This does NOT work

watch: {
   'this.$store.getters["content/hasChanges"]': function() {
     console.log()
   }
}

But that doesn’t work.

Then I thought to simply watch for changes to local storage, but apparently the storage event spec only supports changes made in other tabs/window (javascript - localStorage eventListener is not called - Stack Overflow). Who knew?

So I’m a bit stuck :frowning:

Any ideas on how to achieve this?

Alright, figured it out.

This works:

mounted() {
   this.$store.watch(
      () => this.$store.getters['content/hasChanges'](),
      (newValue, oldValue) => {
         // If `newValue` is `true` then the state has changed from "no changes" to "changes".
         // if `newValue` is `false` then the state has changed from "changes" to "no changes".
      }
   )
}
1 Like