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

"never" seems to trigger mounted() nonetheless

Open simplenotezy opened this issue 3 years ago • 6 comments

I have a very simple component like so:

	<LazyHydrate never :trigger-hydration="false">
		<FreeShippingPopUp />
	</LazyHydrate>

And inside FreeShippingPopUp.vue I have this:

mounted () {
	alert('I am hydrated!');
}

However, the popup appears on the page, which I would expect it wouldn't since it's set to "never". Using version ^2.0.0-beta.2

simplenotezy avatar Nov 19 '20 15:11 simplenotezy

Can't reproduce.

maoberlehner avatar Nov 19 '20 16:11 maoberlehner

The following condition is always true. I am using never in gridsome but client-side rendering is always happening.

if (this.$el.nodeType === Node.COMMENT_NODE) 

milindsingh avatar Dec 27 '20 15:12 milindsingh

@noxify and I have tested on the sandbox and it always triggers the mounted method.

@maoberlehner Any idea whats wrong? We could fix it if you just guide us in the right direction. Thanks

V1: https://codesandbox.io/s/vue-lazy-hydration-example-v1-n99ov V2: https://codesandbox.io/s/vue-lazy-hydration-example-v2-umbgy

milindsingh avatar Dec 29 '20 04:12 milindsingh

@milindsingh vue-lazy-hydration allows you to delay or block the hydration of server-side rendered Vue.js components. In your CodeSandbox example there is no server-side rendering going on. If there is no server-side rendered HTML there also is no hydration. So this package is useless in your examples. If vue-lazy-hydration would block mounting in your example, the component wouldn't render at all. I'm not sure what you expect vue-lazy-hydration to do in a pure client-side context?

maoberlehner avatar Dec 29 '20 05:12 maoberlehner

@maoberlehner Thanks for clearification. I totally understand your point.

I am facing issue with gridsome, where initially ssr content is display but once the page loading done in browser the ssr content is replaced by the new content rendered by component.

milindsingh avatar Dec 29 '20 05:12 milindsingh

I am facing issue with gridsome

Then show me a minimal reproduction of your problem with Gridsome on CodeSandbox 🤔

maoberlehner avatar Dec 29 '20 06:12 maoberlehner