\n {{ item.name }}\n
\n \n\n```\n\n### Page mode\n\nThe page mode expands the virtual-scroller and uses the page viewport to compute which items are visible. That way, you can use it in a big page with HTML elements before or after (like a header and a footer). Set the `page-mode` prop to `true`:\n\n```html\n{{ item.name }}
\n \n\n```\n\nCustomize appearance with `scrollbarOptions`:\n\n```html\n\n \n
\n {{ item.message }}
\n \n {{ item.message }}
\n \n\n {{ item.name }}\n
\n \n\n
\n\n\n\n```\n\n### Options\n\n- `idProp` (default: `vm => vm.item.id`): field name on the component instance (for example: `'id'`) or function returning the id from the component proxy.\n- `initialState`: factory function returning the default state for a new item.\n\n---\n\n## Migrating from vue-virtual-scroller\n\n### Breaking changes\n\n1. **Package name**: Import from `vue-zscroller` instead of `vue-virtual-scroller`\n2. **@vueuse/core** is now a peer dependency\n3. **IdState mixin removed**: Use the `useIdState` composable instead (see [useIdState](#useidstate))\n4. **`update` event signature changed**: Emits a single `UpdateEvent` object instead of 4 positional arguments\n\n### What stays the same\n\nAll component props, events, and slots are the same. Drop-in replacement aside from the import path and the two breaking changes above.\n\n### New stuff\n\n- `empty-item` slot for skeleton/loading placeholders\n- New props: `disableTransform`, `skipHover`, `startAtBottom`, `initialScrollPercent`, `customScrollbar`, `scrollbarOptions`\n- New methods: `scrollToPercent(percent)`, `reset()`\n- `useVirtualScrollPerformance` composable for scroll metrics\n\n#### Code Examples\n\n**Before (vue-virtual-scroller):**\n```vue\n\n {{ item.question }}
\n \n{{ item.name }}
\n \n \n{{ item.name }}
\n \n \n