Hacktoberfest 2026:メンテナが10月に向けて印を付けた、オープンで初心者向けの issue。 Hacktoberfest の issue を見る

Query keys with object property set to undefined are not considered equal to missing property during invalidation

オープン
#3,741 コメント 15 件 リアクション 4 件 担当者 0 名 GitHub で見る

メンテナーはふだん 1 日以内に返信

まだ誰も着手していません。

  • #10795 @AliMahmoudDev による — マージされずにクローズ
  • #11277 @adityachaudhary99 による — マージされずにクローズ

評価

難易度
3/5
見積もり時間
1〜2日
初心者へのやさしさ
52/100
issue の種類
バグ
明瞭さ
おおむね明確
活発さ
静か
技術スタック
react, typescript
領域
frontend

調査の方向性

リンクされた CodeSandbox の再現から始め、文書化されている query-key の決定論的な動作と、欠落しているオブジェクトプロパティおよび undefined のオブジェクトプロパティに対する無効化の結果を比較します。query-key のハッシュ処理と無効化のエントリポイントを追跡し、その後、再現環境で両方のクエリが同じレコードを無効化することを確認します。

索引モデルが issue の本文から書いたものです。

説明

package: react-query
Describe the bug

Query keys with object property set to undefined are not considered equal to missing property. Based on the docs, it should be the same: https://react-query.tanstack.com/guides/query-keys#query-keys-are-hashed-deterministically

Your minimal, reproducible example

https://codesandbox.io/s/react-query-trz8sx?file=/src/App.tsx

Steps to reproduce
  1. Open the codesandbox link
  2. Show codesandbox console
  3. There are two queries rendered, the first fetch all items, and the second fetch filtered ones.
  4. You can see two buttons with invalidation hooks. The first one invalidates both queries, the second one invalidates only non-filtered results. See the console for refetch logs.
Expected behavior

I expect both keys should invalidate the same records no matter of filter: undefined as mentioned in react-query docs.

How often does this bug happen?

Every time

Screenshots or Videos

No response

Platform

macOS v12.4
Chrome 103

react-query version

Both v3.39.1 and v4.0.0-beta.23

TypeScript version

v4.7.3

Additional context

No response

主要言語
TypeScript
スター
50.4k
フォーク
4.2k
平均マージ
7時間 29分
マージ済み PR(30日)
393

環境構築

はじめの一歩

  1. issue を最後まで読み、次にプロジェクトのコントリビューションガイドを読みます。
  2. 着手することを issue にコメントします — 二人が同じ作業をするのを防げます。
  3. リポジトリをフォークし、ブランチを切って変更します。
  4. issue 番号を参照したプルリクエストを送ります。

TanStack/query のほかの issue

TanStack/query の issue をすべて見る

似ている issue

TypeScript の issue をもっと見る

新しい issue をメールで受け取る

初心者向けの GitHub issue を短くまとめたダイジェスト。