原因:addEventListener
绑定的元素在 HTML
中还没有渲染完成(JS 中操作DOM元素的函数方法需要在 HTML 文档渲染完成后才可以使用)
解决办法:
1.在mounted中使用window.onload
window.οnlοad = function () {
let videoElement = document.getElementById('videoElement')
if (videoElement) {
videoElement.muted = true
videoElement.controls = true
}
}
2.使用$(document).ready()
$(document).ready(function () {
let videoElement = document.getElementById('videoElement')
if (videoElement) {
videoElement.muted = true
videoElement.controls = true
}
});
3.使用this.$nextTick
this.$nextTick(()=>{
let videoElement = document.getElementById('videoElement')
if (videoElement) {
videoElement.muted = true
videoElement.controls = true
}
})
4.使用setTimeout
setTimeout(() => {
let videoElement = document.getElementById('videoElement')
if (videoElement) {
videoElement.muted = true
videoElement.controls = true
}
}, 300)
还有人说将script引用的js放在body的最底下,这个对我没有作用,但你们可以尝试一下