获取el-dialog内元素出现Uncaught (in promise) TypeError:Cannot set properties of null (setting ‘innerHTML‘)

1、错误信息

Uncaught (in promise) TypeError:Cannot set properties of null (setting 'innerHTML')

2、原因
根据element-ui的官方文档介绍,Dialog是懒渲染的,在第一次被打开之前都不会渲染到DOM上,如果在Dialog在未渲染的时候就进行getElementById的操作,就会报错


3、解决方法
(1)可以使用文档里在open事件回调中进行元素操作

例子:

Html部分


  
我是一个div

JavaScript部分

dialogOpen() {
  let dom = document.getElementById("divId")
}

(2)先打开弹窗,然后使用this.$nextTick()方法把获取元素的操作套起来,即先打开,等待dialog渲染完成之后再调用getElementById获取元素

例子:

Html部分


  
我是一个div

JavaScript部分

this.dialogVisible = true
this.$nextTick(function(){
  let dom = document.getElementById("divId")
})

你可能感兴趣的:(element-ui,vue.js,javascript,前端)