[Vue][SSR]抑制水合不匹配警告

文章/答案/技术大牛

发布

2回答

vue.js、server-side-rendering

我正在将一个Vue组件呈现为HTML，并且预计DOM呈现/水合并不完全匹配HTML呈现的版本。如何抑制水合不匹配警告？dom-elements.html#suppresshydrationwarning (Is there any way to avoid "Text content did not match" warning in SSR--有没有与之对应的Vue？上下文:我是v

浏览 190提问于2021-07-19得票数 -1

1回答

在Vue中使用Vue.use(插件)

javascript、vue.js、vuejs2、bootstrap-vue、vue-ssr

我有一个插件(引导-vue)，我想用Vue.use()初始化它。现在，我在客户机条目(在router.onReady()中)中使用它，但是我得到以下警告：我使用服务器端渲染(SSR)，不知道在哪里正确调用插件初始化.谢谢!

浏览 0提问于2018-05-07得票数 1

1回答

Nuxtjs使用组件vue-pano

javascript、vue.js、nuxt.js

我在和一起使用了这个错误：“窗口是未定义的”<script> components:{ }</script>import Vue from 'vue' Vue.component('Pano', require(&

浏览 1提问于2018-03-10得票数 0

回答已采纳

2回答

有没有办法避免在使用React的SSR中出现“文本内容不匹配”警告？

reactjs、express、server-side-rendering

我已经和webpack和HMR建立了一个SSR环境。有一个静态呈现的标记，服务器传递给客户机，还有一个带有ReactDOM.hydrate()方法的client.js捆绑包。如果我更改了源代码，HMR可以正常工作，但会在控制台中发出警告，指出客户端代码和静态标记之间存在不匹配。'client.js', } }; 我想知道是否有任何方法可以解决这个问题，因为我想不出任何关于如何使我的标记与我所做的更改相匹配的想法，或

浏览 52提问于2018-12-28得票数 7

回答已采纳

1回答

我能强制水合物给元素添加属性吗？

reactjs

我有以下组件，它在服务器(SSR)上呈现时与在浏览器中呈现时处理方式不同。问题是，当应用程序加水时，ID没有添加。有没有办法强制水合物添加ID？</HeadingAnchor> </Fragment> } else { // SSR-mode

浏览 0提问于2020-11-14得票数 0

2回答

有没有办法抑制React.FC中的水合警告？

javascript、reactjs、typescript

有没有办法抑制React.FC中的水合警告？我有一个警告Did not expect server HTML to contain a <div> in <div>，因为pause: isServer()的事情，但我需要它停止不断请求服务器。</Layout>} ...在打开ssr的情况下导

浏览 55提问于2021-04-26得票数 0

回答已采纳

2回答

禁用Nuxt.js中的客户端水合或停止在Nuxt.js中公开原始数据

javascript、node.js、nuxt.js

我试着用render:route钩子删除它，但是它说那么问题是:如何禁用客户端的水合(客户端虚拟DOM树的呈现)？或者如何停止公开原始数据？

浏览 2提问于2019-12-26得票数 6

1回答

Vue.js和svg模块及不匹配节点

javascript、vue.js、svg

假设我有两个vue模块：<template> <child-module v-for="i in ['a', 'b']" :key="i"/></svg>...<template> //...

浏览 0提问于2019-08-22得票数 0

回答已采纳

1回答

Nuxt获取运行2次(在服务器和客户端)

vue.js、nuxt.js

当我试图在Nuxt中通过fetch()从服务器加载数据时，它会加载2次。我在一个简单的关于页面中尝试了fetch()。 <div id="app" class></template> export default { async fetch() { }

浏览 2提问于2021-06-25得票数 1

回答已采纳

1回答

VueJS水合将dom节点映射到组件

javascript、vue.js、vue-component

我有这个要求，我正在寻找可能的解决方案使用VueJS，因为它有这个很好的功能，水合已经从服务器呈现超文本标记语言。我有一些在.vue文件中没有指定模板的Vue组件，但是它们应该将(水合作用部分)附加到dom元素并使用它。对于附加子组件，我只有一个疑问。举个例子就好了。如果不在.vue文件中指定与此布局匹配的模板，我目前无法理解如何做到这一点。我可以看到，如果我使用vue SSR渲染包进行SSR渲染，这是正确映射的。但我想知道是否有一

浏览 0提问于2018-07-19得票数 1

1回答

vue中的Vuetify按钮- nuxt应用程序的社会共享

javascript、vue.js、nuxt.js、socialshare

我在plugins文件夹中创建了一个文件-vue-社会化共享. in：import VueSocialSharing from "vue-social-sharing"; 将它们包括在nuxt.config.js中 "@/plugins/vuetify", "@/p

浏览 2提问于2019-08-27得票数 3

1回答

Vue服务器端呈现:应用程序未被重新水化，没有引发错误。

vue.js、serverside-javascript

我在我的dist目录中有一个工作的Vue应用程序:当服务器服务时，一切都正常。const renderer = require('vue-server-r

浏览 2提问于2016-11-30得票数 0

回答已采纳

2回答

nextjs react反冲本地存储中的持久值:初始页面加载处于错误状态

reactjs、typescript、next.js、string-interpolation、recoiljs

我有以下代码， const Layout: React.FC<LayoutProps> = ({ children }) => { return (

浏览 51提问于2021-06-24得票数 2

回答已采纳

1回答

如何在Nuxt3中使用Firestore？

firebase、google-cloud-firestore、server-side-rendering、nuxtjs3

我的目标是使防火墙请求SSR，然后将它与firestore的onSnapshot结合，以获得水合完成后的实时更新。我已经创建了这个可组合的useAssetsimport { Asset, RandomAPI, RandomDatabase刷新页面检索，正确呈现项目，但一旦水合进来，它就消失了。在onMounted和useAsyncData中，查询都使它能够通过SSR正确地发送值，使它也能在客户端工作，但仍然存在

浏览 7提问于2022-08-30得票数 0

0回答

Vue.js客户端合并在开发中有效，但在生产中失败

vue.js、vue-ssr

我决定构建我自己的Vue SSR ，我可以在我的项目中使用。它部分基于。一切都很好，并按预期工作。它在dev-server上仍然有效)，但当我为生产构建应用程序时，我突然发现它完全死了。我没有收到任何错误，没有警告，也没有其他任何迹象表明我应该在哪里寻找答案……这让我大吃一惊！这个应用程序在dev-server上运行良好，但在生产中，它似乎完全死了，因为客户端的水合作用不知何故失败了。我不确定这到底是什么..。也许我只是愚蠢到错过了这里的一些非常简单的东西。我就是不知道。

浏览 2提问于2017-12-05得票数 0

4回答

Vue警告客户端呈现的虚拟DOM树不匹配服务器呈现的内容。

html、vue.js、nuxt.js

我试图用Vue.js和Nuxt在表中循环一个tr。但是，当我加载页面时，我会得到以下错误或者失踪。提供水合和充分的客户端渲染。我检查了所有的结束标记，它们似乎是匹配的。这里发生了什么事？

浏览 2提问于2020-01-28得票数 3

1回答

为什么vuetify中的嵌套nuxt链接不起作用？

nuxt.js、vuetify.js

v-icon> </v-btn> </v-card>这给了我在浏览器控制台中的以下警告：但是页面仍

浏览 0提问于2021-08-31得票数 1

回答已采纳

1回答

只在服务器端渲染，即`<server- only >`标签

vue.js、nuxt.js、server-side-rendering

但是，为了防止内容跳转，我尝试仅在服务器端使用以下代码呈现元素： <div v-if="$isServer" class="h-nonav bg-gray-500" /> 这确实有效，但Vue抱怨服务器端的HTML与客户端的HTML不匹配。这样做是可行的，但听起来太老土了，并导致页面呈现两次： <div v-if="ssr" class="h-nonav bg-gray-500" />dat

浏览 10提问于2021-08-31得票数 0

2回答