TypeError: Cannot read properties of null (reading ‘nextSibling‘)

最新推荐文章于 2024-09-05 08:00:00 发布
最新推荐文章于 2024-09-05 08:00:00 发布
阅读量593 收藏 2
点赞数 5
文章标签： vue.js 前端 javascript typescript 前端框架
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/BUG_CONQUEROR_LI/article/details/140182947
版权

做项目用的Vue3+Vite, 在画静态页面时，点击菜单跳转之后总是出现如下报错，百思不得其解。看了网上很多回答，也没有解决问题，然后试了很多方法，最后竟然发现是template里边没有结构的原因。。。

原来我的index.vue是这样的：

修改之后：

 

离谱哈哈，有时候真的是意想不到的bug啊...

A_STUDY程序媛
关注
解决TypeError: Cannot read properties of null (reading ‘xxx‘)的错误
念兮为美
03-14 7万+
解决TypeError: Cannot read properties of null (reading ‘xxx‘)的错误.
Vue3 - 解决报错 Uncaught (in promise) TypeError: Cannot read properties of null (reading ‘insertBefore‘)
王佳斌
07-16 3975
vue3，nuxt3，无法读取null的属性（读取“insertBefore”），vue3 insertBefore，报错，Uncaught (in promise) TypeError: Cannot read properties of null (reading ‘insertBefore‘)，详细解决，v-if 导致，v-show，渲染时报错，dom元素，改变时报错，组件，插件，vue版本升级，依旧报错，还是不行，改了还报错，点击按钮展示弹框报错，本地启动时，页面所有操作正常，显示正常；部署到生产环
Vue 3 路由异常Cannot read properties of null (reading ‘nextSibling)
huangjinsheng1988的专栏
11-23 5575
导致路由不能正常跳转，定位问题是服务返回Object数据类型，需要前端转化为json字符串显示。
vue3 keep-alive 引起Cannot read properties of null ( reading ‘nextSibling‘)
laozhong110的专栏
07-13 6385
vue keep-alive nextSibling
TypeError: Cannot read properties of null (reading ‘previousSibling‘)
pusscat_xue的博客
12-14 591
vue页面报错导致页面显示异常，原因未知，但将页面中的v-if换成v-show可解决报错问题，在此记录一下。
搭建vue3项目时出现Cannot read property ‘nextSibling‘ of null报错
weixin_45142089的博客
10-25 7027
vue3项目搭建时，出现Cannot read property 'nextSibling' of null报错的解决方法
报错：Uncaught TypeError: Cannot read property ‘nextSibling‘ of undefined [duplicate]
weixin_52047574的博客
12-12 568
当时在调用一个自己写的vue组件，在调用正确的形势下，始终报如题的错误。在多次查阅资料无果后，喊来大佬帮忙看看，最后大佬排错了所有地方，最后在调用的组件里发现一个prop的字母打错了，popup被打成了pupup，我死活也没发现这个单词拼写错误。
vue3 - element plus 报错 TypeError: Cannot read properties of null (reading ‘emitsOptions‘)，使用组件报错详细解决
高级前端工程师
06-12 4463
vue3，elementPlus，TypeError: Cannot read properties of null (reading 'emitsOptions')，TypeError: Cannot read properties of null (reading 'insertBefore')，vue3使用element-plus中el-table组件报错关键字'emitsOptions'与'insertBefore'分析，在本地运行的时候一点错误也没有，但是打包后放到线上环境就开始报错，vue3报错
出现 TypeError: Cannot read properties of undefined (reading ‘getUserMedia‘） 解决方法
最新发布
码农研究僧的博客
09-05 1738
启用 HTTPS: 为你的网页启用 HTTPS，这不仅解决了 getUserMedia 的问题，还能提高整体的安全性和用户信任度
vue项目控制台报错信息问题记录：Uncaught TypeError: Cannot read properties of null (reading ‘setAttribute‘)
Lililiming_的博客
02-20 4611
vue + element-ui 项目控制台报错信息记录：Uncaught TypeError: Cannot read properties of null (reading ‘setAttribute‘)，TypeError: Cannot read properties of undefined (reading ‘label‘)，
Vue--修复报错 Error in render: “TypeError: Cannot read properties of null (reading ‘substring‘)“
weixin_45406850的博客
07-22 5279
Error in render: “TypeError: Cannot read properties of null (reading ‘substring‘)“
解决vue中报错 “TypeError: Cannot read properties of null (reading ‘forEach‘)“
希望看完文章的你能够带着答案离开
07-12 3万+
解决vue中报错 “TypeError: Cannot read properties of null (reading ‘forEach‘)“
Uncaught (in promise) TypeError: Cannot read properties of null (reading ‘insertBefore‘)解决
weixin_45337447的博客
05-31 1725
原因：fromData里面的数据是接口返回的，页面按钮已经加载完毕，接口没有返回数据时候，不会报错，但是一旦返回数据，链式找不到父节点控制台就会报错。解决方式： 不能用v-if,用v-show代替，判断表达式前确保上一层有数据。
搜索功能遇到TypeError：Cannot read property ‘indexOf‘ of null问题解决方法
测试领域专家，多领域测试技术、管理、工具都略懂，略懂一二
01-11 6721
搜索功能：https://blog.csdn.net/bbs11007/article/details/110948483 根据这个搜索功能的写法，搜索的时候在本地调式木有问题，但是打包build为dist后，放到服务器后显示错误：Cannot read property ‘indexOf‘ of null let result = this.pages1.values.filter(row => {//this.pages1.values这个是表内所有数据 ...
【vue3常见报错1】TypeError: Cannot read property ‘xxx‘ of null/undefined
朱远辉的博客
05-19 1724
【vue3常见报错1】TypeError: Cannot read property 'xxx' of null/undefined：确认变量已声明并正确初始化。确认DOM元素已正确加载，避免在生命周期钩子函数中访问未完全加载的元素。
深入理解并解决Uncaught TypeError: Cannot read properties of null“的全面指南“
热门推荐
奇妙的Bug之旅
11-10 10万+
在JavaScript中，当你试图访问一个null或undefined对象的属性时，就会抛出这个错误。例如，如果你有一个变量x，它的值为null，然后你尝试访问x.property，就会得到"Uncaught TypeError: Cannot read properties of null"的错误。在使用任何变量之前，都应该先检查它是否已经定义。你可以使用typeof操作符来检查一个变量的类型。// 访问x的属性。
TypeError: Cannot read properties of null (reading ‘indexOf‘)
m0_49608552的博客
05-11 1万+
Cannot read properties of null (reading 'indexOf')问题解决
Vue报错：Vue TypeError:Cannot read property ‘xxx‘ of null
01-30 2万+
问题 使用Vue绑定数据显示的时候，报错： Vue TypeError:Cannot read property ‘xxx’ of null 但是页面又显示正常，数据也正常。 原因 我们在data中绑定了数据，比如数据名为 article 但是初始的数据是null，我们的想法是等会mounted中初始化，传入响应数据对象。 但是Vue在渲染页面的时候已经绑定了数据，不如article.title，在请求前找到article是null，所以才会出现上面的报错 解决 在使用到article对象的模块加上了 v-
Vue报错TypeError: Cannot read properties of null (reading ‘insertBefore‘)
weixin_42940307的博客
06-05 1974
从报错上看，看不到太多的信息与提示，因此对于第一次遇到这种报错的人，往往不知道从何下手去修复报错。自动渲染页面的数学公式。那么报错很可能就是因为你设置的自动渲染功能，其实就是因为你完全按照官网的方式设置导致的[doge]。，那么有可能把正常的代码也给渲染成数学公式了，结果就出现了。总结一下，是否有感觉Vue或者Nuxt中有不少报错，是源于。，具体原因可能涉及Vue或Nuxt的底层原理。有时候，之所以会报错，就是因为你使用了。的自动渲染设置，将自动渲染函数里面的。来渲染数学公式，或者修改你。
Cannot read properties of null (reading 'nextSibling
09-12
"Cannot read properties of null (reading 'nextSibling')"这个错误通常是因为尝试在一个值为null的对象上访问属性或方法而导致的。根据你提供的引用，这个错误可能与HTML/XML节点操作有关。 在IE中，nextSibling属性不会返回文本节点，而在Chrome或Firefox等其他浏览器中会返回文本节点。这意味着，在使用nextSibling属性时，如果下一个节点是文本节点，那么在IE中可能会遇到null值的情况。因此，当你尝试在这个null值上使用nextSibling属性时，就会出现"Cannot read properties of null (reading 'nextSibling')"的错误。 另外，在el-table-column渲染时，如果scope.row.field（field为任意字段值）不存在，直接对其执行length、toString()等方法也会导致报错。这是因为当scope.row.field不存在时，它的值为null或undefined，而这些值是没有length和toString()方法的。因此，如果你尝试在不存在的字段上执行这些方法，就会出现类似的错误。 最后，当默认弹框是关闭的时，DOM中没有弹框中的内容。但是，当你打开弹框并关闭后，弹框中的DOM元素并没有被销毁，仍然存在于DOM中。如果你尝试操作这些不应该存在的DOM元素，就可能会导致类似的报错。 综上所述，"Cannot read properties of null (reading 'nextSibling')"错误可能由于在null值上访问属性或方法而导致。在HTML/XML节点操作中，特别是使用nextSibling属性、在不存在的字段上执行方法或尝试操作不应该存在的DOM元素时，请确保先进行必要的检查和验证，以避免这个错误的发生。
评论 2
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值