Hacktoberfest 2026 : les issues que les mainteneurs ont marquées pour octobre, ouvertes et accessibles aux débutants. Parcourir les issues Hacktoberfest

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

Ouverte
  • Quelque chose ne va pas ?
#9,824 2 commentaires 0 réactions 0 personnes assignées Voir sur GitHub

Les mainteneurs répondent en général sous 1 jour

@ArjunCodess y travaille déjà.

Depuis le 19/9/2026.

Évaluation

Difficulté
4/5
Temps estimé
3-5 jours
Accessibilité débutants
45/100
Type d'issue
Bug
Clarté
À clarifier
Activité
Active
Stack technique
typescript
Domaine
frontend

Piste de recherche

Commencez par le playground Svelte lié et reproduisez l’avertissement à l’aide des exemples Player.svelte, FormPlayers.svelte et FormPlayerSkill.svelte du rapport. Lisez les indications de Svelte concernant binding_property_non_reactive ainsi que le comportement de $derived et de $bindable, puis comparez la manière dont le résultat de TanStack Svelte Query est exposé. Le travail est terminé lorsqu’il est établi pourquoi cette liaison n’est pas réactive et que le comportement pris en charge est documenté ou confirmé.

Rédigé par le modèle d'indexation à partir du texte de l'issue.

Description

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

Langage dominant
TypeScript
Étoiles
50.4k
Forks
4.3k
Merge moyen
11 h 37 min
PR mergées (30 j)
521

Préparer son environnement

Par où commencer

  1. Lisez l'issue en entier, puis le guide de contribution du projet.
  2. Signalez en commentaire que vous la prenez — cela évite que deux personnes fassent le même travail.
  3. Forkez le dépôt et travaillez sur une branche.
  4. Ouvrez une pull request qui référence le numéro de l'issue.

Autres issues de TanStack/query

Toutes les issues de TanStack/query

Issues similaires

Plus d'issues TypeScript

Recevez les nouvelles issues par e-mail

Un résumé court des issues GitHub adaptées aux débutants.