feathers-vuex
feathers-vuex copied to clipboard
FeathersVuexGet component doesn't work with params
Steps to reproduce
<template>
<FeathersVuexGet
v-slot="{ item: user }"
service="users"
:id="id"
:fetch-params="{ query : { $eager: '[profile]' } }"
>
<pre> {{ user }} </pre>
</FeathersVuexGet>
</template>
...
id: 42
Expected behavior
User object with nested profile object
Actual behavior
User object is empty. The component works fine without params. The query return the expected results without the component.
The issue is how the component use the store getters. According to the documentation fetchParams
is only used for the API for the API server, and the component should only use the resource id on the store getters. But currently, params
and fetchParams
are used in the same way:
https://github.com/feathersjs-ecosystem/feathers-vuex/blob/4ae03bae9b31802e5355871826626ca80236a3ce/src/FeathersVuexGet.ts#L119-L121
Because the params are passed to the store getters, the store returns null.
https://github.com/feathersjs-ecosystem/feathers-vuex/blob/4ae03bae9b31802e5355871826626ca80236a3ce/src/FeathersVuexGet.ts#L95-L105
getArgs
return [0: 42, 1: { query : { $eager: '[profile]' }}]
and the query is passed as args to the store getters.
Replacing
return this.$store.getters['${this.service}/get'](args) || null
by
return this.$store.getters['${this.service}/get'](this.id) || null
produce the expected results confirming the issue.
System configuration
Latest version of the package.
Oh, good point! If you want to make a PR to separate them, I'll accept it. I don't have the ability to focus on this right now.
Thanks for the excellent bug report.