Javascript 客户端呈现的虚拟DOM树不匹配

我有以下问题：

在标题中，您可以阅读我的错误消息。 我的

layouts/default.vue

中有一个代码，用于检查我是否在此浏览器中存储了cookie。 如果是这样，我从cookie中获取数据并将其存储在我的

store/index.vue

if (getCookie("jwt") != null) {
    this.$store.commit("storageToken", getCookie("jwt"));
}

在我的店里我得到了这个密码：

storageToken: function(state, payload) {
   state.token = payload;
   state.loggedIn = true;
},

现在的问题是

状态.loggedIn

。如果我将其从false设置为true，它会显示错误，因为在

layouts/default.vue

中有一个

numxt链接

，如下所示：

 <nuxt-link v-if="$store.state.loggedIn" class="loginbtn" to="dashboard">Dashboard</nuxt-link>

它现在工作，但我现在的问题是一个搜索引擎优化的问题。我的实习生链接现在对谷歌爬虫不可见。当我分析我的网站时，它说“找不到任何实习生链接”

---

那么，我该如何让它再次发挥作用呢？我在这里找不到答案，在google上也找不到答案

您在客户端和服务器上的状态应该相同，例如loggedIn。在服务器和客户端上，它解析为不同的值

 <client-only>
    <nuxt-link v-if="$store.state.loggedIn" class="loginbtn" to="dashboard">Dashboard</nuxt-link>
 </client-only>