Skip to content
advanced

Challenge: Build a Virtualized List Component

Implement this from the stub. Hidden tests grade the behaviour you write, not the comments you leave.

Challenge: Virtualized List

<script setup lang="ts">
import { ref, computed, onMounted, onUnmounted } from 'vue'

interface Props {
  items: unknown[]
  itemHeight: number
  containerHeight: number
  overscan?: number
  reachEndThreshold?: number
}

const props = withDefaults(defineProps<Props>(), {
  overscan: 5,
  reachEndThreshold: 100,
})

const emit = defineEmits<{
  scroll: [scrollTop: number]
  reachEnd: []
}>()

// Your implementation here
</script>

<template>
  <!-- Your template here -->
</template>
challenge — implement from scratchCtrl+↵ submits · Ctrl+Shift+↵ runsstarter code