solid-swr-store

> SolidJS bindings for swr-store

 

Install

``bash
npm install --save swr-store solid-swr-store
`

`bash
yarn add swr-store solid-swr-store
`

Usage

`tsx
import { Suspense } from 'solid-js';
import { createSWRStore } from 'swr-store';
import { useSWRStore, useSWRStoreSuspenselesss } from 'solid-swr-store';

const API = 'https://dog.ceo/api/breed/';
const API_SUFFIX = '/images/random';

interface APIResult {
message: string;
status: string;
}

const dogAPI = createSWRStore({
key: (breed: string) => breed,
get: async (breed: string) => {
const response = await fetch(${API}${breed}${API_SUFFIX});
return (await response.json()) as APIResult;
},
revalidateOnFocus: true,
revalidateOnNetwork: true,
});

function DogImage(): JSX.Element {
const data = useSWRStore(dogAPI, ['shiba']);

return ;
}

function DogImageSuspenseless(): JSX.Element {
const data = useSWRStoreSuspenseless(dogAPI, ['shiba']);

return () => {
const current = data();

if (current.status === 'pending') {
return

Loading...

;
}
if (current.status === 'failure') {
return

Something went wrong.

}
return ;
};
}

function Trigger(): JSX.Element {
return (
type="button"
onClick={() => {
dogAPI.trigger(['shiba']);
}}
>
Trigger

);
}

export default function App(): JSX.Element {
return (
<>

Loading...}>

);
}

Subscribes to an SWR store, passing args, which are received by the corresponding store for data-fetching and cache updates.

options has the following properties:

- initialData: Allows lazy hydration when reading the store. If the store does not have cache, initialData hydrates the cache and attempts a revalidation. If no initialData is provided, defaults to store's options.initialData.
- shouldRevalidate: If true, goes through the revalidation process when reading through the cache. Defaults to true.

$3

Has the same API as useSWRStore` except that it doesn't suspend the reading component.

License

MIT © lxsmnsyc