Type 'bigint' is not assignable to type 'Key | null | undefined' when trying to use virtualItem.key as react component key
维护者通常 1 天内回复
评估
- 难度
- 3/5
- 预计耗时
- 1-2 天
- 新手友好度
- 45/100
- Issue 类型
- 缺陷
- 描述清晰度
- 描述清楚
- 活跃度
- 停滞
- 技术栈
- react, typescript
- 领域
- frontend
调研方向
从 index.d.ts 第 98 行生成的类型声明开始，并在链接的 StackBlitz 示例中的 main.tsx 里重现该错误。在 TypeScript 4.9.5 下，将公开的 virtualItem.key 类型与 React 的 key 类型进行比较；当 key={virtualItem.key} 无需 String workaround 即可通过类型检查时，即表示完成。
由索引模型根据 Issue 内容生成。
描述
Describe the bug
<SomeItem key={virtualItem.key} />
results in:
Type 'Key' is not assignable to type 'Key | null | undefined'.
Type 'bigint' is not assignable to type 'Key | null | undefined'.ts(2322)
index.d.ts(98, 9): The expected type comes from property 'key' which is declared here on type 'IntrinsicAttributes'
I suspect this may be due to being on an older version of React than what the Key type is targeting? But I don't think this should matter.
const key = String(virtualItem.key); works fine as a workaround, but it'd be nice if either:
Keytype from installed version of React is usedKeytype is inferred fromgetItemKeyKeytype could be passed to useVirtualizer, likeuseVirtualizer<TItemKey>(...)
As always, great job with this library. I love it! ❤
Your minimal, reproducible example
https://stackblitz.com/edit/tanstack-virtual-pksf2gfh?file=src%2Fmain.tsx
Steps to reproduce
- Open StackBlitz link
- In main.tsx, scroll down to
key={virtualRow.key}and see the type error
Expected behavior
Shouldn't get a type error
How often does this bug happen?
Every time
Screenshots or Videos
No response
Platform
- MacOS 14.4
- VSCode 1.98.2
- TypeScript 4.9.5
tanstack-virtual version
@tanstack/[email protected]
TypeScript version
4.9.5
Additional context
No response
Terms & Code of Conduct
- I agree to follow this project's Code of Conduct
- I understand that if my bug cannot be reliable reproduced in a debuggable environment, it will probably not be fixed and this issue may even be closed.
- 主要语言
- TypeScript
- 星标
- 7.1k
- 派生
- 472
- 平均合并
- 1 天 2 小时
- 30 天内合并 PR
- 12
环境准备
- 没有 Dockerfile 或 Docker Compose 文件
- 有 Pull Request 模板
- 阅读贡献指南
从这里开始
- 先读完整个 Issue，再读项目的贡献指南。
- 在 Issue 下留言说明你要接手 —— 这能避免两个人做同样的事。
- Fork 仓库，在一个分支上完成修改。
- 提交 Pull Request，并在描述里引用这个 Issue 编号。
TanStack/virtual 的其他 Issue
-
measureElement caches 0 size for nodes that aren't attached yet (Vue: rows stack at start 0 and the list scrolls away on mount)可能已有人在做 @webn00b 于 9 天前认领。 未关闭
难度 2/5 1-3 小时 新手友好度 78/100
维护者通常 1 天内回复
-
`scrollToIndex(last, { align: 'end' })` stays short of the end after a measured row grows (virtual-core ≥ 3.17.0)可能已有人在做 @minwookshin 于 7 天前认领。 未关闭
难度 4/5 3-5 天 新手友好度 55/100
TanStack/virtual#1290 · 1 条评论 ·
维护者通常 1 天内回复
-
virtual-core: desktop Safari drops the prepend anchor write when history lands during the top rubber-band bounce可能已有人在做 关联的 PR 仍在进行中或已合并。 未关闭
难度 5/5 一周以上 新手友好度 38/100
维护者通常 1 天内回复
-
难度 4/5 3-5 天 新手友好度 62/100
维护者通常 1 天内回复
-
marko-virtual: scrollToEnd during an in-flight prepend strands the view one prepend above the bottom (chat-pretext e2e fails on CI)可能重新可做 关联的 PR 已关闭且未合并。 未关闭
难度 4/5 3-5 天 新手友好度 55/100
维护者通常 1 天内回复
相似的 Issue
-
enhancement good first issue priority: low size: XS
难度 2/5 1-3 小时 新手友好度 82/100
维护者通常 1 天内回复
-
难度 1/5 1-3 小时 新手友好度 88/100
-
难度 1/5 1 小时以内 新手友好度 90/100
streamplace/streamplace#1351 ·
维护者通常 2 天内回复
-
automated issue report
难度 2/5 1-3 小时 新手友好度 66/100
databendlabs/databend-docs#3511 ·
-
automated issue report
难度 2/5 1-3 小时 新手友好度 65/100