vue.js - Vuex store 在 Nuxt 中的什么位置

Question

只是想了解一下 Vuex/Nuxt，这对 nodejs 来说也很陌生。

鉴于 nuxt 是一个服务器端渲染应用程序，Vuex“驻留在”哪里。在标准 Vue 中，Vuex 是一个客户端存储。它在 Nuxt 中是如何工作的？它仍然是客户端存储，只是首先在服务器上呈现吗？

如果它保留在服务器上，那么我只是想知道它如何处理每个用户的数据 - 或者它是否以某种方式共享。谢谢。

Answer 1

SSR 和补液:

客户端和服务器都保存状态。当客户端发出第一个加载初始页面的请求时，状态通常通过脚本中的 html 文档传递，例如:

<script type="text/javascript" defer>window.__NUXT__={"data":[{"name":"server"}],"error":null,"serverRendered":true}</script>

然后当应用程序 js 加载时它必须拾取状态，这个过程被称为再水化。从这一点开始，客户端将保持服务器状态同步。

Nuxt 细节:

Nuxt 文档中有趣的部分:

• https://nuxtjs.org/guide/async-data
• https://nuxtjs.org/guide/vuex-store

Nuxt Vuex 演示:

https://nuxtjs.org/examples/vuex-store

Vue SSR:

此外，请查看 vue ssr 文档，它非常详细，并且更好地解释了一切如何适应:

• https://ssr.vuejs.org/en/hydration.html
• https://ssr.vuejs.org/en/data.html

we will serialize and inline the state in the HTML. The client-side store can directly pick up the inlined state before we mount the app.