Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[📖] Handling useResource$() without a <Resource /> #6955

Open
Kampouse opened this issue Oct 9, 2024 · 1 comment
Open

[📖] Handling useResource$() without a <Resource /> #6955

Kampouse opened this issue Oct 9, 2024 · 1 comment
Labels
COMP: docs Improvements or additions to documentation STATUS-1: needs triage New issue which needs to be triaged

Comments

@Kampouse
Copy link
Contributor

Kampouse commented Oct 9, 2024

Suggestion

adding a explicit example on how to handle the case
https://discord.com/channels/842438759945601056/1293247102637441064/1293570046924161055

import {
  component$,
  useResource$,
  useSignal,
  useTask$,
} from "@builder.io/qwik";

export const NoResourceNeeded = component$(() => {
  const tracked = useSignal(0);
  const resolvedValue = useSignal<number>();
  const rejectedValue = useSignal<any>();

  const resource = useResource$(({ track }) => {
    const value = track(() => tracked.value);

    return value + 1;
  });

  useTask$(async ({ track }) => {
    const promise = track(() => resource.value);

    try {
      resolvedValue.value = await promise;
    } catch (e) {
      rejectedValue.value = e;
    }
  });

  return (
    <div>
      {resource.loading && <div>Loading...</div>}
      {resolvedValue.value && <div>Resolved: {resolvedValue.value}</div>}
      {rejectedValue.value && <div>Rejected: {rejectedValue.value}</div>}

      <button onClick$={() => tracked.value++}>Click</button>
    </div>
  );
});
@Kampouse Kampouse added COMP: docs Improvements or additions to documentation STATUS-1: needs triage New issue which needs to be triaged labels Oct 9, 2024
@ianlet
Copy link
Contributor

ianlet commented Oct 10, 2024

Thanks @Kampouse!

For context: this was a very minimalist example I wrote to show someone how it could work. For doc purpose it could be improved a bit.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
COMP: docs Improvements or additions to documentation STATUS-1: needs triage New issue which needs to be triaged
Projects
None yet
Development

No branches or pull requests

2 participants