nuxt项目Failed to execute 'appendChild' on 'Node',有没有什么好办法?

挑战
  • 588

nuxt项目,刷新页面之后报错Error while initializing app DOMException: Failed to execute 'appendChild' on 'Node': This node type does not support this method.有没有什么好的解决办法?

回复
阅读 13.2k
6 个回答

我刚碰到,一般在开发环境下,日志会有warning:The client-side rendered virtual DOM tree is not matching server-rendered content. This is likely caused by incorrect HTML markup, for example nesting block-level elements inside <p>, or missing <tbody>. Bailing hydration and performing full client-side render.

但是不影响使用,而且一般都是在刷新当前页面的时候才会报这个警告。但是一旦build发布到线上就会发生DOMException: Failed to execute 'appendChild' on 'Node': This node type does not support this method的问题。

我的解决方案是,直接在疑似产生The client-side rendered virtual DOM tree is not matching server-rendered content问题的代码上包裹一层<client-only>标签,直接不让后台渲染这部分代码就解决这个问题了

在created里给对象赋值了, 放到mounted里就可以了

多罗罗
  • 1
新手上路,请多包涵

在console大概率能看到是哪里报的错误,在楼上warning前面些位置,然后找到该文件,用<no-SSR>包裹起来就好,低版本可能需要使用<client-only>。我这边的话,主要是<nuxt-link>包裹了自定义组件导致的

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
宣传栏