https://stackblitz.com/edit/solidjs-templates-xxkqgjv6?file=src%2FApp.tsx
import { createMemo, createSignal, isPending, latest, Loading } from 'solid-js';
export default function App() {
const [count, setCount] = createSignal(0);
const asyncValue = createMemo(async () => {
const c = count();
await new Promise((resolve) => setTimeout(resolve, 1000));
return `Async Value ${c}`;
});
const asyncValue2 = createMemo(async () => {
const c = count();
await new Promise((resolve) => setTimeout(resolve, 5000));
return `Async Value 2 ${c}`;
});
return (
<Loading fallback="Loading...">
<button onClick={() => setCount(count() + 1)}>Click me</button>
<p style={{ opacity: isPending(count) ? 0.5 : 1 }}>Count: {count()}</p>
<p style={{ opacity: isPending(() => latest(asyncValue)) ? 0.5 : 1 }}>
Latest Async Value: {latest(asyncValue)}
</p>
<p style={{ opacity: isPending(asyncValue2) ? 0.5 : 1 }}>
Async Value 2: {asyncValue2()}
</p>
</Loading>
);
}
- On initial Load
{latest(asyncValue)} is undefined
- First click of the button doesn't make
isPending(() => latest(asyncValue)) to true
- Second click of the button makes it go pending, but I expected it to clear earlier
https://stackblitz.com/edit/solidjs-templates-xxkqgjv6?file=src%2FApp.tsx
{latest(asyncValue)}is undefinedisPending(() => latest(asyncValue))to true