pinafore/routes/_components/virtualList/VirtualListLazyItem.html

{{#if props}}
  <VirtualListItem :component
                   :offset
                   :props
                   :key
                   :index
  />
{{/if}}
<script>
  import VirtualListItem from './VirtualListItem'
  import { mark, stop } from '../../_utils/marks'
  import { scheduleIdleTask } from '../../_utils/scheduleIdleTask'

  export default {
    async oncreate() {
      // TODO: there appears to be a bug in {{#await}} that means we have to do this manually.
      // Some items may appear on top of other items because their offset is 0 and never updated.
      let makeProps = this.get('makeProps')
      let key = this.get('key')
      if (makeProps) {
        let props = await makeProps(key)
        scheduleIdleTask(() => { // delay slightly to avoid slow scrolling
          mark('VirtualListLazyItem set props')
          this.set({props: props})
          stop('VirtualListLazyItem set props')
        })
      }
    },
    components: {
      VirtualListItem
    }
  }
</script>