Kong / swrv

Stale-while-revalidate data fetching for Vue

Home Page:https://docs-swrv.netlify.app

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Feature request: Computed keys

ivos opened this issue · comments

  • Feature request
  • SWRV version 1.0.0-beta.8.

It might be handy to be able to use keys that are Vue 3 computed().

When using a Vue 3 computed() key now, the following warning is reported in console:

Write operation failed: computed value is readonly

setter	@	reactivity.esm-bundler.js:1106
set value	@	reactivity.esm-bundler.js:1095
watch.immediate	@	use-swrv.ts:385
callWithErrorHandling	@	runtime-core.esm-bundler.js:6737
callWithAsyncErrorHandling	@	runtime-core.esm-bundler.js:6746
job	@	runtime-core.esm-bundler.js:7154
doWatch	@	runtime-core.esm-bundler.js:7199
watch	@	runtime-core.esm-bundler.js:7040
useSWRV	@	use-swrv.ts:384
useSignalConfigurations	@	signal-configuration-api.js:9                <--- my app code

And in signal-configuration-api.js:

import { computed } from 'vue'
import useSWRV from 'swrv'
import { docsUrlPrefix } from '../somewhere/else'

const url = computed(() =>
  docsUrlPrefix.value + '/signal-configurations.json'
)

export const useSignalConfigurations = () => useSWRV(url, undefined, { revalidateOnFocus: false })

Obviously, there is a simple workaround by using an inline function literal to extract the value of the computed: useSWRV(() => url.value, ....

It might be worthwhile however to support computed keys directly in SWRV.

This line leads to the warning:

keyRef.value = val

and here's the keyRef created:

const keyRef = typeof key === 'function' ? (key as any) : ref(key)

Alternatively, it might be beneficial to validate the key when useSWRV() is called and fail fast by reporting invalid/unsupported type of the key.

@ivos i like it! Would you be open to contributing the fix?

Here goes.

I wasn't able to write a test that would actually fail when this is not implemented. When the feature is not implemented, the test passes, but reports the above warning to console. With the prod code change, no warning is reported on console.

Should you have any idea how to make the test fail, pls let me know, I'll try my best to amend it.