diff --git a/examples/unnecessary-rerenders/index.tsx b/examples/unnecessary-rerenders/index.tsx
index 90f204e0..a0c8ca36 100644
--- a/examples/unnecessary-rerenders/index.tsx
+++ b/examples/unnecessary-rerenders/index.tsx
@@ -20,7 +20,8 @@ function NameInput({
}) {
return (
)
}
diff --git a/exercises/03.concurrent-rendering/README.mdx b/exercises/03.concurrent-rendering/README.mdx
index 77f9cb00..9dbe3854 100644
--- a/exercises/03.concurrent-rendering/README.mdx
+++ b/exercises/03.concurrent-rendering/README.mdx
@@ -51,7 +51,7 @@ function App() {
const deferredText = useDeferredValue(text)
return (
<>
- setText(e.target.value)} />
+ setText(e.currentTarget.value)} />
>
)
diff --git a/exercises/06.rerenders/README.mdx b/exercises/06.rerenders/README.mdx
index 3604ed43..8b0cdccd 100644
--- a/exercises/06.rerenders/README.mdx
+++ b/exercises/06.rerenders/README.mdx
@@ -59,7 +59,8 @@ function NameInput({
}) {
return (
)
}
@@ -125,7 +126,8 @@ const NameInput = memo(function NameInput({
}) {
return (
)
})
diff --git a/exercises/07.windowing/01.problem.virtualizer/src/app.tsx b/exercises/07.windowing/01.problem.virtualizer/src/app.tsx
index 21aa5b3e..6c80cd60 100644
--- a/exercises/07.windowing/01.problem.virtualizer/src/app.tsx
+++ b/exercises/07.windowing/01.problem.virtualizer/src/app.tsx
@@ -24,7 +24,7 @@ function CityChooser() {
const isPending = useSpinDelay(isTransitionPending)
- // 🐨 create a ref here for HTMLDivElement
+ // 🐨 create a ref here for HTMLUListElement
// 🐨 create a rowVirtualizer with useVirtualizer from "@tanstack/react-virtual"
// - the count should be the length of the items
diff --git a/exercises/07.windowing/README.mdx b/exercises/07.windowing/README.mdx
index b91015d3..d8a53a95 100644
--- a/exercises/07.windowing/README.mdx
+++ b/exercises/07.windowing/README.mdx
@@ -63,19 +63,21 @@ function MyListOfData({ items }) {
```tsx
// after
function MyListOfData({ items }) {
- const listRef = useRef()
+ const parentRef = useRef(null)
+
const rowVirtualizer = useVirtualizer({
- size: items.length,
- getScrollElement: () => listRef.current,
+ count: cities.length,
+ getScrollElement: () => parentRef.current,
estimateSize: () => 20,
})
return (
-
+
{rowVirtualizer.getVirtualItems().map(virtualItem => {
- const { index, key, size, start } = virtualItem
const item = items[index]
+ if (!item) return null
+ const { index, key, size, start } = virtualItem
return (