vue项目动态src ，video无法正常播放问题记录
问题记录
在vue2项目中，mp4视频地址由后端异步请求获取，使用静态的url时视频能够正常播放，异步请求获取视频地址，:src='“url” 视频出现无法播放的问题
文章目录
问题记录测试代码测试1测试2测试3插件地址
测试代码
后端返回的数据
// 文档 (https://flowercloud.net/aff.php?aff=11050)
{
"code": 200,
"msg": "test",
"data": "https://lf9-cdn-tos.bytecdntp.com/cdn/expire-1-M/byted-player-videos/1.0.0/xgplayer-demo.mp4"
}
// 文档 (https://flowercloud.net/aff.php?aff=11050)
提示：以下是本篇文章正文内容，下面案例可供参考
测试1
将url 绑定在video标签的src属性上，vue实例的data中 data.url 没有初值也可以正常播放
// 文档 (https://flowercloud.net/aff.php?aff=11050)
data() {
return {
data: {
url: ''
}
};
},
测试2
将url 绑定在video标签内source 标签的src属性上，vue实例的data中 data.url 不管有没有初值都无法播放后端传输的url，有初始值播放的是有初始值的视频
// 文档 (https://flowercloud.net/aff.php?aff=11050)
Download the
video.
data() {
return {
data: {
url: 'https://media.w3.org/2010/05/sintel/trailer.mp4'
}
};
},
测试3
将url 绑定在vue-core-video-player插件的src属性上，vue实例的data中 data.url 有初值可以正常播放
// 文档 (https://flowercloud.net/aff.php?aff=11050)
data() {
return {
data: {
url: 'https://media.w3.org/2010/05/sintel/trailer.mp4'
}
};
},
插件地址
文档目录: vue-core-video-player