Calling a getter with a parameter from inside a component (TypeError: getter is not a function)

[sergiomartindev]

Quoting the documentation:

<template>
  <p>User 2: {{ getUserById(2) }}</p>
</template>

The thing is that it only seems to work when you call the getter, passing it a parameter, from inside the template. But what I'm looking for is to call that getter from inside of my component's script .

Store:

  getters: {
    counterMultipliedBy: (state) => (multiplier) => state.counter * multiplier
  },

Component:

import { useTestStore } from './stores/test';
import { storeToRefs } from 'pinia';

const testStore = useTestStore();

const { counterMultipliedBy } = storeToRefs(testStore);
const counterMultipliedByThree = counterMultipliedBy(3);

But then, a message warns me saying that "TypeError: counterMultipliedBy is not a function". Even though it returns a function.

Any idea? 🙏

[dreambo8563]

@sergiomartindev , have a try like this.

import { useTestStore } from './stores/test';
import { computed } from "@vue/reactivity";

const testStore = useTestStore();

const counterMultipliedByThree =  computed(()=>testStore.counterMultipliedBy(3));

[posva]

It's because storeToRefs returns refs, so you need counterMultipliedBy.value(3)