当前位置:   article > 正文

vue中使用video-player视频插件,第一次无法监听父组件穿过来的值解决办法_video标签父级的点击事件被阻止

video标签父级的点击事件被阻止
需求:
		页面![在这里插入图片描述](https://img-blog.csdnimg.cn/20201208141906802.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L0FfOTg4OA==,size_16,color_FFFFFF,t_70)
  • 1

作品清单是从后端请求回来的不同格式的url,前端需求根据后缀动态判断格式,然后对齐进行下载和播放;视频播放用的是video-player插件,父页面可以不断点击播放按钮,把要播放的URL地址传给子组件video-player负责展示;
问题:第一次请求回来,点击第一个视频播放是无法播放的,再点击就可以播放。
核心:watch深度监听就不去深究,只分析方法。

代码

父页面在这里插入图片描述

![在这里插入图片描述](https://img-blog.csdnimg.cn/20201208142550307.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L0FfOTg4OA==,size_16,color_FFFFFF,t_70)
  • 1

在这里插入图片描述

子页面
在这里插入图片描述

在这里插入图片描述


核心
watch监听父页面传来的值,但是第一次还是无法深度监听到,所以第一次就直接把传过来的值给在这里插入图片描述
后面切换地址之后就用监听就可以了。

声明:本文内容由网友自发贡献,不代表【wpsshop博客】立场,版权归原作者所有,本站不承担相应法律责任。如您发现有侵权的内容,请联系我们。转载请注明出处:https://www.wpsshop.cn/w/不正经/article/detail/468816
推荐阅读
相关标签
  

闽ICP备14008679号