Hacktoberfest 2026: những issue maintainer đã đánh dấu cho tháng Mười, đang mở và phù hợp người mới. Xem issue Hacktoberfest

Bug: Dependent Query doesn't work with solid-js SSR

Đang mở
  • Có gì không ổn?
#7,513 8 bình luận 1 reaction 1 người được giao Xem trên GitHub

Maintainer thường phản hồi trong vòng 1 ngày

@ardeora đang làm issue này rồi.

Từ ngày 4/6/2024.

Đánh giá

Issue này chưa được đánh giá.

Mô tả

bug package: solid-query
Describe the bug

In the Tanstack documentation there is a section about dependent queries: https://tanstack.com/query/latest/docs/framework/react/guides/dependent-queries

The example suggest that you should use enable to create dependent queries. The problem when using enable is that when it is disabled it doesn't suspend the current context and therefore doesn't fetch on the server.

Your minimal, reproducible example

https://codesandbox.io/p/github/BierDav/temp-tanstack-query-ssr-bug/master?import=true

Steps to reproduce
  1. Open codesandbox
  2. Run ´pnpm dev`
  3. Open the preview
  4. Now the server waits for 2 seconds before responding because of the timout query in src/routs/index.tsx, but the moment it finishes it doesn't care about the second query getting enabed and returning it immediately to the browser.
  5. This causes that the client has to fetch the remaining state query. You can see that in the dev tools:
    image
Expected behavior

The expected behavior would be that both queries are beeing evaluated before the server sends its initial response. But I don't know if this is even possible with this syntax from a technical perspective.

How often does this bug happen?

Every time

Screenshots or Videos
import { createQuery } from "@tanstack/solid-query";

export default function () {
  const timeout = createQuery(() => ({
    queryKey: ["timeout"],
    queryFn: () =>
      new Promise((resolve) => setTimeout(() => resolve("test"), 2000)),
  }));

  const state = createQuery(() => ({
    queryKey: ["realQuery"],
    queryFn: async () => {
      const resp = await fetch("https://api.sampleapis.com/switch/games");
      console.log("fetched");
      return await resp.json();
    },
    enabled: !!timeout.data,
  }));

  return <>{JSON.stringify(state.data?.[0])}</>;
}
Platform
  • Windows
  • Node v21.7.3
  • Chrome
Tanstack Query adapter

solid-query

TanStack Query version

v5.40.0

TypeScript version

No response

Additional context

No response

Ngôn ngữ chính
TypeScript
Star
50.4k
Fork
4.2k
Merge trung bình
13 giờ 33 phút
Pull request đã merge (30 ngày)
383

Chuẩn bị môi trường

Bắt đầu từ đâu

  1. Đọc hết issue, rồi đọc hướng dẫn đóng góp của dự án.
  2. Bình luận trên issue rằng bạn sẽ nhận — tránh hai người làm cùng một việc.
  3. Fork repository và làm thay đổi trên một nhánh.
  4. Mở pull request có tham chiếu số hiệu của issue.

Issue khác của TanStack/query

Tất cả issue của TanStack/query

Issue tương tự

Thêm issue về TypeScript

Nhận issue mới trong hộp thư của bạn

Bản tóm tắt ngắn những issue GitHub phù hợp với người mới.