Akryum / vue-virtual-scroller

⚡️ Blazing fast scrolling for any amount of data
https://vue-virtual-scroller-demo.netlify.app
9.48k stars 901 forks source link

Vue 3 DynamicScrollerItem default slot issue #683

Open mrsweaters opened 3 years ago

mrsweaters commented 3 years ago

When attempting to implement the DynamicScroller in Vue 3, I'm getting a TypeError: this.$slots.default is not a function exception when I attempt to render the DynamicScrollerItem component. If I remove the component, the exception goes away.

<DynamicScroller
  :items="filteredLocations"
  :min-item-size="100"
  key-field="uuid"
>
  <template v-slot="{ item, index, active }">
    <DynamicScrollerItem
      :item="item"
      :active="active"
      :size-dependencies="[
        item.properties.name,
        item.properties.address,
      ]"
      :data-index="index"
    >
      <div>{{item.uuid}}</div>
    </DynamicScrollerItem>
  </template>
</DynamicScroller>

Using version 2.0.0-alpha.1.

nntai commented 3 years ago

I got the same issue when trying to use 2.0.0-alpha.1. My code:

    <dynamic-scroller
      :items="flatNodes"
      :min-item-size="18"
      class="w-4/4 h-4/4"
    >
      <template #default="{ item, index, active }">
        <dynamic-scroller-item
          :item="item"
          :active="active"
          :data-index="index"
          :data-active="active"
        >
          <div>
            {{ index }} - {{ active }}
          </div>
        </dynamic-scroller-item>
      </template>
    </dynamic-scroller>

Error on console: image

nntai commented 3 years ago

I think PR #666 could fix this issue

mgershowitz commented 2 years ago

did this issue ever get solved?