Cannot read properties of null (reading ‘style‘)前端错误记录21/10/20
前端错误记录Vue报错Cannot read properties of null (reading ‘style‘)Vue报错Cannot read properties of null (reading ‘style‘)起因: Vue框架书写代码时,控制页面的显示隐藏使用到了 v-if并且在mounted中引用函数,判断并渲染这个v-if下面的元素了<div v-if="this.pag
Vue报错
Cannot read properties of null (reading ‘style‘)
起因: Vue框架书写代码时,控制页面的显示隐藏使用到了 v-if
并且在mounted中引用函数,判断并渲染这个v-if下面的元素了
<div v-if="this.pageFunction==='distributeDetail' || this.pageFunction==='checkDetail'"></div>
this.$nextTick(()=>{
this.form.setFiledsValue(value)
})
原因:
v-if
初始渲染
初始值为 false 组件不会渲染,生命周期钩子不会执行,v-if 的渲染是惰性的。
初始值为 true 时,组件会进行渲染,并依次执行 beforeCreate,created,beforeMount,mounted 钩子。
切换
false => true
依次执行 beforeCreate,created,beforeMount,mounted 钩子。
true => false
依次执行 beforeDestroy,destroyed 钩子。
v-show
渲染
无论初始状态,组件都会渲染,依次执行 beforeCreate,created,beforeMount,mounted 钩子,v-show 的渲染是非惰性的。
切换
对生命周期钩子无影响,切换时组件始终保持在 mounted 钩子。
得出 在钩子函数运行过程中,我操作了v-if中未渲染的dom元素
最后将v-if改成v-show解决问题
版权声明:本文为CSDN博主「家有仙女名为何瑜」的原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接及本声明。
原文链接:https://blog.csdn.net/a791812366/article/details/120870807
更多推荐
所有评论(0)