[Vuejs]-How to update vue component data item from vuex store based on condition

by

0👍

If store data changes, and this is done reactively, you could just use mapGetters like below, also don’t set values directly with computed values, what you are doing in isActive is more of a method, setting values with computed properties can often lead to endless loops of change.

If I understood you correctly, I would try out the below.

import { mapGetters } from 'vuex';

export default {
   props: {
      name: {
         type: String,
         required: true
      }
   },

   data() {
      return {
         slotParams: {}
      }
   },

   computed: {
      ...mapGetters({
         encounter: 'whatever-your-path-is/encounter'
      });,

      isActive() {
         return this.encounter.name === this.name;
      }
   },

   watch: {
      encounter: {
         deep: true,
         handler() {
            // This might be where you want to check conditional for this.isActive
            this.slotParams = JSON.parse(JSON.stringify(this.encounter.params));

            /*
               if (this.isActive) {
                  this.slotParams = JSON.parse(JSON.stringify(this.encounter.params));
               }
            */
         }
      }
   }
}

Leave a comment