FileUpload Templated: Inconsistency in getFiles() and totalSize calculation during onSelect and onRemove events
まだ誰も着手していません。
評価
- 難易度
- 3/5
- 見積もり時間
- 1〜2日
- 初心者へのやさしさ
- 45/100
- issue の種類
- バグ
- 明瞭さ
- おおむね明確
- 活発さ
- 停滞
- 技術スタック
- next.js, react
- 領域
- frontend
調査の方向性
FileUpload コンポーネントの onSelect と onRemove のイベントフロー、および headerTemplate または itemTemplate を使用した場合の getFiles() の動作から始めます。React 18.3.1 と PrimeReact 10.9.7 で問題を再現し、その後、getFiles() が更新されたファイルリストを同期的に反映すること、また totalSize の計算で setTimeout が不要になっていることを確認します。
索引モデルが issue の本文から書いたものです。
説明
Describe the bug
When utilizing the FileUpload component with custom templates (headerTemplate, itemTemplate), managing the total file size state (totalSize) externally becomes inconsistent. The onSelect and onRemove events appear to fire asynchronously relative to the component's internal file list update.
Reproducer
No response
System Information
"react": "18.3.1",
"react-dom": "18.3.1",
"primereact": "^10.9.7",
Steps to reproduce the behavior
Steps to Reproduce:
Create a FileUpload component using the App Router in Next.js (client-side) with headerTemplate to display an external totalSize state managed by useState.
Implement onSelect and onRemove handlers that attempt to use fileUploadRef.current.getFiles() to accurately calculate the current total size.
Select a single file (File A). The displayed total size is incorrect (often 0 or delayed).
Select a second file (File B). The total size calculation often incorrectly duplicates the size of File A plus the size of File B (e.g., A + A + B), or only shows the size of File A.
Deleting File B sometimes synchronizes the size correctly, sometimes no
Expected behavior
fileUploadRef.current.getFiles() should reliably and synchronously reflect the updated list of files immediately after the onSelect or onRemove events have fired, allowing external state management to remain synchronized without requiring workarounds.
Current Workaround:
The only reliable way to achieve synchronization is by using setTimeout(syncTotalSize, 0) within the onSelect and onRemove handlers to defer the state update to the next event loop tick.
- 主要言語
- CSS
- スター
- 8.3k
- フォーク
- 1.2k
- PR マージ指標
- 30日以内にマージされた PR はありません
環境構築
- Dockerfile・Docker Compose ファイルなし
- プルリクエストのテンプレートあり
- コントリビューションガイドを読む
はじめの一歩
- issue を最後まで読み、次にプロジェクトのコントリビューションガイドを読みます。
- 着手することを issue にコメントします — 二人が同じ作業をするのを防げます。
- リポジトリをフォークし、ブランチを切って変更します。
- issue 番号を参照したプルリクエストを送ります。
primefaces/primereact のほかの issue
-
難易度 2/5 1〜3時間 初心者へのやさしさ 72/100
primefaces/primereact#8552 ·
-
難易度 1/5 1〜3時間 初心者へのやさしさ 88/100
primefaces/primereact#8550 ·
-
Row checkbox selection tick is invisible in Landing Page Theme section対応中かも @Prakash1185 が 152 日前に担当しました。 オープン
難易度 2/5 1〜3時間 初心者へのやさしさ 68/100
primefaces/primereact#8545 ·
-
Dependency conflict between jspdf v4 and jspdf-autotable during npm install対応中かも @Kamran92 が 167 日前に担当しました。 オープン
難易度 2/5 1〜3時間 初心者へのやさしさ 72/100
primefaces/primereact#8537 ·
-
難易度 3/5 1〜2日 初心者へのやさしさ 58/100
primefaces/primereact#8551 ·
primefaces/primereact の issue をすべて見る
似ている issue
-
難易度 2/5 1〜3時間 初心者へのやさしさ 70/100
hexlet-codebattle/codebattle#2374 ·
-
難易度 2/5 1〜3時間 初心者へのやさしさ 66/100
Equal-Vote/bettervoting#1754 ·
メンテナーはふだん 2 日以内に返信
-
Add search field to Scheduled Tasks対応中かも @WorstPIlot が今日担当しました。 オープン
難易度 2/5 1〜3時間 初心者へのやさしさ 75/100
openmediavault/openmediavault#2309 ·
-
clawsweeper:fix-shape-clear clawsweeper:queueable-fix clawsweeper:source-repro impact:auth-provider issue-rating: 🦞 diamond lobster no-stale P1
難易度 2/5 1〜3時間 初心者へのやさしさ 70/100
steipete/oracle#614 · コメント 1 件 · リアクション 1 件 ·
メンテナーはふだん 1 日以内に返信
-
enhancement
難易度 2/5 1〜3時間 初心者へのやさしさ 78/100
MoonshotAI/kimi-code#4590 ·
メンテナーはふだん 1 日以内に返信