virtualItem()
function virtualItem(model, index): DirectiveResult<typeof RefDirective>;Lit element directive that observes one rendered virtual item.
Parameters
model
index
number
Returns
DirectiveResult<typeof RefDirective>
Related examples
- HorizontallitThis example virtualizes a horizontal collection: columns are measured and positioned along the x-axis while the browser keeps a native horizontal scrollbar.
- Simple ListlitThis is the smallest complete virtual list for each framework. Application data stays in the framework while the adapter renders and measures only the current visible range.
- Sticky Header And FooterlitThis example keeps a header and footer inside the scrolling viewport while the virtual item range remains measured and independently positioned.
- Variable SizelitThis example renders rows whose heights differ and can change after mount. Mounted items report their real border-box size, replacing the initial estimate without requiring application-side layout reads.
- Nested ContainerlitThis example separates the native scroll owner from the element that contains the virtual range. Content can appear before the list while core still measures the nested offset and publishes the correct geometry.
- TablelitThis example virtualizes dynamic rows without breaking native table semantics. Spacer rows represent content above and below the rendered range because a positioning wrapper cannot sit between tbody and tr.