我想实现当页面有多个视频时，点击播放视频将其他以播放视频暂停

[Libpzzz]

组件绑定的事件
@play="onPlay"

const onPlay = (ev) => {
nextTick(()=>{
let videoPlays = document.getElementsByClassName('videoPlay')
if(videoPlays && videoPlays.length > 1){
for (const video of videoPlays) {
console.log(videoPlayRef.value,video.paused);
if (ev.srcElement && ev.srcElement !== video && !video.paused) {
video.pause()
}
}
}
})
}
但是这样好像只有里面的video暂停了，但是底部的组件好像没有判断出已经展厅了，左下角还是播放的图标，且点击我使用video.pause()暂停的视频之后还是显示暂停

[Libpzzz]

解决了，我发现这个标签的父级的同级的input标签绑定了点击事件来控制视频的播放跟暂停，然后我改了监听播放的事件：
const onPlay = (ev) => {
nextTick(()=>{
let videoPlays = document.getElementsByClassName('videoPlay')
if(videoPlays && videoPlays.length > 1){
for (const video of videoPlays) {
if (ev.srcElement && ev.srcElement !== video && !video.paused) {
// 获取父级标签
const parentElement = video.parentElement.parentElement;
const input = parentElement.querySelector('input.d-player-input');
input.click()
}
}
}
})
}
但是不知道会不会有什么其他问题