Nuxt.js 中的组件可以与 Next.js 类似的客户端渲染和服务器渲染混合使用吗？答案

【问题标题】：Can you mix up Client rendering and Server rendering for components in Nuxt.js similar to Next.js?Nuxt.js 中的组件可以与 Next.js 类似的客户端渲染和服务器渲染混合使用吗？
【发布时间】：2021-08-27 07:47:41
【问题描述】：

在 Next.js 中，您可以在同一页面上拥有一个静态端渲染或服务器端渲染的组件和另一个客户端渲染的组件。你能在 Nuxt.js 中做同样的事情吗？好像找不到合适的答案。

【问题讨论】：

看来问题是指一种混合模式，您可以同时为网站设置 SSG 和 SSR。 nextjs.org/docs/advanced-features/automatic-static-optimization。 Nuxt 没有混合模式 IIRC。它是 SSG 或 SSR。
@Kunukn 真的很好。我们需要看看 OP 在这里是什么意思，但是据我所知，Nuxt 中也没有 SSG + SSR 组合。不确定 Nuxt Nitro 是否会这样做，它更适用于边缘渲染（据我所知，无服务器上的 SSR）。
嗨@vjori，你在找什么的最新消息？
@kissu Nuxt.js 中 Next.js 的等效功能。在 Next.js 中，您可以在一个页面中混合使用 4 种渲染模式。我想知道 Nuxt.js 是否为我们更喜欢 Vue.js 而不是 React.js 支持这个功能。
你能用 4 种模式的更多细节更新你的问题吗？另外，它们可以同时使用吗？

标签： vue.js nuxt.js

【解决方案1】：

默认情况下，您的组件会在以下两种情况下呈现：服务器 + 客户端（当然，如果您的应用不仅仅是 SPA）。
仅对于客户端渲染，您可以使用 <client-only> 作为包装器，如下所述：https://nuxtjs.org/docs/2.x/features/nuxt-components/#the-client-only-component

没有像<server-only> 这样的东西，但您可以通过以下方式防止水合：https://github.com/maoberlehner/vue-lazy-hydration

【讨论】：