How to take full height of available container? about svelte-tiny-virtual-list

[inzanez]

I do not know if that helps,...
itemCount does not get calculated. It's basically the total number of items that you wish to display in the list. Of course, the list does calculate the number of items it can display with the given space, which is set using height.

So, one option is to do something like this:

<script>
// Keeps track of the hight of the div that contains the VirtualList
let listHeight;

let myItems = [1,2,3,4,5];
let myItemSize = 50;

</script>

// Bind the divs height to the listHeight variable, use that variable in VirtualList
// to set to full height.
<div class="list" bind:clientHeight={listHeight}>
  <VirtualList
	  height={listHeight}
	  width="auto"
	  itemCount={myItems.length}
	  itemSize={myItemSize}
  >
	  <div slot="item" let:index let:style {style} class="row">
		  ...
	  </div>
  </VirtualList>
</div>

[Corrl]

When listHeight is set via the parent component this solution didn't seem to work at first with scrollOffset or scrollToIndex . But after setting an initial value export let listHeight = 500; everything seems fine again

[jonasgeiler]

Can I close this issue?