小编use*_*454的帖子

使用SSR时如何防止Nuxt水合?

我们正在使用这种方法来呈现内容:

<div id="full-article" v-html="content"></div>
this.content = api.response.data
Run Code Online (Sandbox Code Playgroud)

在这种方法中,“内容”是从 API 检索的,但因为我们还使用服务器端渲染 (SSR),所以最终的 HTML 变成了这样:

<div id="full-article">$real_html_content</div>
this.content = $real_html_content
Run Code Online (Sandbox Code Playgroud)

这种方法意味着内容会被重复,一次作为呈现的 HTML,一次作为 JavaScript 变量。但在这种情况下,我们没有使用 javascript 内容变量。事实上,它仍然包含在最终的 HTML 页面中,这意味着页面大小是所需大小的两倍。我们怎样才能防止这种情况发生呢?是否有某种方法可以隐藏/删除已由 SSR 呈现的 JavaScript 内容?

或者,也许以不同的方式处理这些内容会更好,也许在稍后阶段插入它而不涉及 Nuxt 或 SSR?

vue.js server-side-rendering nuxt.js

5
推荐指数
1
解决办法
4064
查看次数

标签 统计

nuxt.js ×1

server-side-rendering ×1

vue.js ×1