how do i play i youtube video in vuejs3 and toggle a button to play/pause the video?can some one give me an example code?
I tried this but did not work:
<script >export default { data() { return { videoIcon: true, showFrame: false } }, mounted() { document.querySelector('.overlay').addEventListener('click', (event) => { if (!event.target.closest('.ytvideo')) { this.websites[4].showFrame = false; video.pause(); } }); document.querySelector('.video span').addEventListener('click', () => { if (video.paused) { video.play(); } else { video.pause(); } }); },}</script><template lang="pug">body .container .video video span(@click="showFrame = !showFrame; videoIcon = !videoIcon"): font-awesome-icon(:icon="videoIcon ? 'fa-solid fa-play' : 'fa-solid fa-pause'") .overlay(v-show="showFrame") div(class="ytvideo") iframe(src="https://www.youtube.com/embed/PwrL493Hv9Q" class="video-frame")</template>thank you in advance