v-if not working with plyr.

[kenyonbowers]

So, I have this code,
<vue-plyr v-if="devotionalVideoSrc && globalVideoState === VideoPlayerState.playing"> <video controls> <source size="1080" :src="devotionalVideoSrc" type="video/mp4" /> </video> </vue-plyr>
And I have a button that toggles the globalVideoState. When I click, and the globalVideoState is changed to VideoPlayerState.playing, it loads like it should. However, when I click it again two more times (so I toggle it to open again) it doesn't show. Idk what is going on.

[john-muinde]

I had the same issue. Wrap the vue-plyr with the vuejs template component and add the if to it.

Had the same issue but in my component I render youtube or other links dynamically

<vue-plyr ref="plyr" :options="plyrOptions" @ready="handlePlayerReady"
@playing="handlePlaying" @Pause="handlePause" @ended="handleEnded">