vue-lazy-hydration icon indicating copy to clipboard operation
vue-lazy-hydration copied to clipboard

LazyHydrate not work for me

Open nekooee opened this issue 3 years ago • 3 comments

Hi, I used the LazyHydrate as follows but But in all cases, even "never" immediately runs the slideshow and the photos are displayed. What is the reason?

<template>
    <LazyHydrate when-idle>
        <header-slide-show :laravel-slides="images" :rtl="rtl"></header-slide-show>
    </LazyHydrate>
</template>

<script>
import LazyHydrate from 'vue-lazy-hydration';

export default {
    components: {
        LazyHydrate,
        headerSlideShow: () => import('./headerSlideShow'),
    },
    props: [
        'images', 'rtl'
    ],
    name: "loadHeaderSlideShow"
}
</script>

nekooee avatar Oct 24 '21 20:10 nekooee

Maybe you're looking for lazy-loaded components because this package is for lazy-hydration. Meaning that your content is generated on server-side and shown immediately, but its "interactivity" is applied later.

DavidGolodetsky avatar Nov 03 '21 14:11 DavidGolodetsky

Maybe you're looking for lazy-loaded components because this package is for lazy-hydration. Meaning that your content is generated on server-side and shown immediately, but its "interactivity" is applied later.

Hi, Do you mean that this package is only for ssr?

nekooee avatar Nov 03 '21 14:11 nekooee

Yup, it's from the package dscription:

This plugin will not work as advertised if you're not using it in combination with SSR. Although it should work with every pre-rendering approach (like Prerender SPA Plugin, Gridsome, ...) I've only tested it with Nuxt.js so far.

DavidGolodetsky avatar Nov 03 '21 21:11 DavidGolodetsky