quasar icon indicating copy to clipboard operation
quasar copied to clipboard

Router view don't work well with virtual scroll

Open JustYummy opened this issue 2 years ago • 1 comments

What happened?

Nested routes, use keep alive component with include, pages all using virtualScroll, when switch between it, error occurs.

截屏2023-10-23 14 11 33 截屏2023-10-23 14 20 56

RouterView2, Didn't use include

<router-view v-slot="{ Component }">
    <keep-alive v-if="$route.meta.keepAlive">
      <component :is="Component" :key="$route.path"></component>
    </keep-alive>
    <component :is="Component" v-if="!$route.meta.keepAlive"></component>
 </router-view>

RouterView3, use include

<router-view v-slot="{ Component }">
    <keep-alive v-if="$route.meta.keepAlive" :include="includeData">
      <component :is="Component" :key="$route.path"></component>
    </keep-alive>
    <component :is="Component" v-if="!$route.meta.keepAlive"></component>
 </router-view>

or just use router view

<router-view />

Error will be occur.

but if RouterView3 use the code as RouterView2, it works will. the error text shows that, the rootRef is null, may be the QVirtualScroll component is unmounted, and rootRef value is deleted.

What did you expect to happen?

No Error.

Reproduction URL

https://github.com/JustYummy/keep-alive-virtual-scroll

How to reproduce?

  1. download code
  2. run yarn or npm install
  3. run yarn dev or npm run dev

Flavour

Quasar CLI with Vite (@quasar/cli | @quasar/app-vite)

Areas

Components (quasar)

Platforms/Browsers

Chrome, Safari, Electron

Quasar info output

No response

Relevant log output

No response

Additional context

No response

JustYummy avatar Oct 23 '23 07:10 JustYummy

I have the same problem, updates about it?

EmptySpace99 avatar Feb 05 '24 09:02 EmptySpace99