Vue Js Mounted did not triggred onpage load

Question

Not sure the reason why mounted is no triggered any function in it. tested by display 'ss' also cannot be print out when page is loaded.

export default {
  name: 'loads',
  components: {
    Overlay,
  },
  data() {
    return {
      subscribed: true,
    };
  },
computed: {
    filteredLocation() {
      return this.$store.getters['location/filterLocation'](this.searchTerm);
    },
  },
  methods: {
    checkSubscriptionValidity() {
      this.$store.dispatch('user/checkTrial').then((res) => {
        this.subscribed = res.data;
      });
    },
  },
  mounted() {
    console.log('ss');
    this.checkSubscriptionValidity();
  },
};

is there any other reason that can cause this mounted not triggered issues?

Answer 1

Please try this syntax:

  computed: {
    filteredLocation: () => {
      return this.$store.getters['location/filterLocation'](this.searchTerm);
    },
  },
  methods: {
    checkSubscriptionValidity: () => {
      this.$store.dispatch('user/checkTrial').then((res) => {
        this.subscribed = res.data;
      });
    },
  },
  mounted: () => {
    console.log('ss');
    this.checkSubscriptionValidity();
  },