Hacktoberfest 2026: die Issues, die Maintainer für den Oktober markiert haben – offen und einsteigerfreundlich. Hacktoberfest-Issues durchsuchen

[svelte] Why can't I bind to a `createQuery` result?

Offen
  • Stimmt etwas nicht?
#9,824 2 Kommentare 0 Reaktionen 0 zugewiesene Personen Auf GitHub ansehen

Maintainer antworten meist innerhalb von 1 Tag

@ArjunCodess arbeitet bereits daran.

Seit 19.9.2026.

Bewertung

Schwierigkeit
4/5
Geschätzter Aufwand
3-5 Tage
Anfängerfreundlichkeit
45/100
Issue-Typ
Bug
Klarheit
Muss geklärt werden
Aktivitätsstatus
Aktiv
Tech-Stack
typescript
Bereich
frontend

Rechercherichtung

Beginne mit dem verlinkten Svelte playground und reproduziere die Warnung anhand der im Bericht enthaltenen Beispiele Player.svelte, FormPlayers.svelte und FormPlayerSkill.svelte. Lies die Anleitung zu Svelte binding_property_non_reactive zusammen mit dem Verhalten von $derived und $bindable und vergleiche anschließend, wie das Ergebnis von TanStack Svelte Query bereitgestellt wird. Als abgeschlossen gilt die Untersuchung, wenn geklärt ist, warum diese Bindung nicht reaktiv ist, und das unterstützte Verhalten dokumentiert oder bestätigt wurde.

Vom Indexierungsmodell aus dem Issue-Text verfasst.

Beschreibung

package: svelte-query
Describe the bug

Using Svelte (v5.42.3) and Svelte Kit (v2.48.2) and @tanstack/svelte-query (v6.0.3).

If I have the component Player.svelte:

<script lang="ts">
    import { createQuery } from '@tanstack/svelte-query';

    const playerStore = createQuery(() => ({
        queryKey: "key",
        queryFn: playerById(page.params.player_id),
    }));

    let { data: player } = $derived(playerStore);
</script>

<FormPlayers bind:player={player} />

and FormPlayers.svelte:

<script lang="ts">
    type Props = {
        player: Player;
    };

    let {
        player = $bindable(),
    }: Props = $props();
</script>

{#each player.skills as skill, index (skill.id)}
    <FormPlayerSkill bind:skill={player.skills[index]} />
{/each}

and FormPlayerSkill.svelte:

<script lang="ts">
    type Props = {
        skill: PlayerSkillInput;
    };

    let {
        skill = $bindable()
    }: Props = $props();
</script>

<Date bind:date={skill.date} />

I get the error:

FormPlayers.svelte:77 [svelte] binding_property_non_reactive
`bind:skill={player.skills[index]}` (src/routes/players/FormPlayers.svelte:40:4) is binding to a non-reactive property
https://svelte.dev/e/binding_property_non_reactive

Why? Isn't the let { data: player } = $derived(playerStore) assignable / bindable / editable / "Sveltable"?

Your minimal, reproducible example

I'll post ASAP (it's not easy).

Tanstack Query adapter

svelte-query

TanStack Query version

6.0.3

TypeScript version

5.9.3

Vorherrschende Sprache
TypeScript
Sterne
50.4k
Forks
4.3k
Ø Merge
12 Std. 18 Min.
Gemergte PRs (30 T.)
488

Entwicklungsumgebung

Erste Schritte

  1. Lesen Sie das ganze Issue und danach den Beitragsleitfaden des Projekts.
  2. Schreiben Sie ins Issue, dass Sie es übernehmen — das erspart doppelte Arbeit.
  3. Forken Sie das Repository und arbeiten Sie in einem Branch.
  4. Öffnen Sie einen Pull Request, der die Issue-Nummer nennt.

Mehr aus TanStack/query

Alle Issues in TanStack/query

Ähnliche Issues

Weitere Issues zu TypeScript

Neue Issues direkt in Ihr Postfach

Eine kurze Übersicht über anfängerfreundliche GitHub-Issues.