Linked Questions

Popular Questions

Getter does not update when route param updates

Asked by At

I have a vue3 app that has a parameterized route and a Pina store getter that gets a list of items based on the route param.

My issue is that my list of values from the store (gotten via a getter) does not get re-gotten when the route param is updated.

<script lang="ts" setup>
  import {useIncStore} from "@/store/inc";
  import {useRoute} from "vue-router";

  const route = useRoute()
  const state = Array.isArray(route.params.state) ? route.params.state[0] : route.params.state
  const incStore = useIncStore();

  // EDIT - Neither of these work...
  const incs = incStore.getByState(state)
  // const incs = computed(() => incStore.getByState(state))

</script>

How can I call incStore.getByState(state) again when state updates? If I put {{state}} on my page it updates when the route changes but my list of items does not.

Here is my getter in the store:

  getters: {
    getByState(state) {
      return (s: string) => state.records.filter((rec: any) => rec.state === s)
    }
  }

Related Questions