<div v-html="info.brief" class="content" ref="editor" @click="judgeImg($event)"></div>
<script>
export default {
mounted() {
const observer = new MutationObserver(this.addVideoListeners);
const editorElement = this.$refs.editor; // 假设富文本编辑器有一个ref="editor"
observer.observe(editorElement, { childList: true, subtree: true });
},
beforeDestroy() {
// 清除MutationObserver
const observer = new MutationObserver(this.addVideoListeners);
const editorElement = this.$refs.editor;
observer.disconnect();
},
methods: {
addVideoListeners(mutations) {
mutations.forEach(mutation => {
mutation.addedNodes.forEach(node => {
if (node.tagName.toLowerCase() === 'video') {
// 为新添加的video元素添加事件监听器
node.addEventListener('play', this.pauseOtherVideos);
}
});
});
},
pauseOtherVideos(event) {
const videos = this.$el.querySelectorAll('video');
videos.forEach(video => {
if (video !== event.target) {
video.pause();
}
});
}
}
};
</script>主要是富文本编辑器里的视频 所以比较难折腾
