网上的垃圾代码太多,最后翻了video.js的官方文档,就这么简单,浪费了我这么久,注:我这里使用的vue

//html

<video  id="my-player" controls autoplay preload="auto" class="video-js vjs-big-play-centered vjs-fluid vjs-16-9 vjs-big-play-centered"
controls preload="auto" data-setup='{}'>
<source id='videoid' :src="videosrc" type="application/x-mpegURL">
</video>

//随便定义一个方法

<p @click="selectomit >点击我</p>

//vue  methods里面

selectomit (){

var that = this;
that.videosrc = '你的路径';
console.log(that.videosrc);
var player=videojs('my-player');
console.log(player);
player.src({
src:that.videosrc
})

}

vue使用 video.js动态切换视频源视频源不刷新问题的更多相关文章

  1. vue使用video.js解决m3u8视频播放格式

    今天被这个关于m3u8视频播放不了搞了一下午,这个项目所有的视频流都是m3u8格式的,后台给我们返回的都是m3u8格式的视频流,解决了好长时间,看了好多博客,只有这个博客给我点启发,去解决这个问题,请 ...

  2. vue基于video.js实现视频播放暂停---切图网

    切图网是最早致力于PSD2HTML切图等web前端外包服务的,随着前端技术的更新迭代,现在也已经全面投入了vue的浪潮了,下面是vue中实现视频播放的方法. vue.js中引入video视频播放器 m ...

  3. video.js分段自动加载视频【html5视频播放器】

    突发奇想的需求,要在官网上放一个一个半小时的视频教程…… 然而,加载成了问题,页面是cshtml的.net混合网站,不知道哪儿的限制,导致视频加不出来. 没有办法,只能前端想办法了. 于是将视频切割成 ...

  4. js 动态切换视频

    如图所示,想要一个这样的效果,就是点击下面视频标题时,上面的视频跟着切换,但是要求页面不重新加载. 参考文章在这里 这里贴上部分代码供大家参考. <li id="about_li6&q ...

  5. js动态切换图片

    <script language =javascript > $(function () { initAds(); }); function initAds() { var curInde ...

  6. video.js 应用于网站需要视频的

    http://www.cnblogs.com/lechenging/p/3858181.html

  7. 微信 vue中使用video.js播放m3u8视频,解决安卓自动全屏的问题。

    最近一个项目中需要在微信中播放m3u8格式的视频,刚开始用了 vue-video-player 这个插件,在IOS手机体验良好,本以为完事了, 结果安卓手机一点播放就自动全屏,心态略崩.查了资料说是安 ...

  8. 【vue】使用 Video.js 播放视频

    目录 安装 引入 使用 参考文档 环境: vue 2.0+ element ui (这里的代码用了elmentui的按钮样式,可以不用elment ui的样式) 安装 在项目中安装 video.js. ...

  9. 前端视频直播技术总结及video.js在h5页面中的应用

    全手打原创,转载请标明出处:https://www.cnblogs.com/dreamsqin/p/12557070.html,多谢,=.=~ (如果对你有帮助的话请帮我点个赞啦) 目前有一个需求是在 ...

随机推荐

  1. Windows10系统优化(批处理)

    经历过XP.Win7.Vista.Win8之后,Win10有了很大的改变,虽然Win10刚出时,非常糟糕,甚至很长一段时间被认为没有Win7,但是随着Win10的不断优化不断更新,已经慢慢的变得更好了 ...

  2. linux --运行模式

    运行模式也可以称之为运行级别 在Linux中存在一个进程:init (initialize:初始化)init 的进程id 是1 ps -ef | grep init 该进程存在一个对应的配置文件 in ...

  3. Loadrunner中遇到Failed to connect to server[10061] connection refused错误

    (1)run-time setting/browser emulation中,将simulate a new user on each iteration  选项去掉(默认是选中的). 重新运行一切正 ...

  4. Sentinel源码解析四(流控策略和流控效果)

    引言 在分析Sentinel的上一篇文章中,我们知道了它是基于滑动窗口做的流量统计,那么在当我们能够根据流量统计算法拿到流量的实时数据后,下一步要做的事情自然就是基于这些数据做流控.在介绍Sentin ...

  5. GraphQL-- 使用Apollo Server搭建Node服务端

    一.关于Apollo Server Apollo Server是一种使用JS创建GraphQL服务端的一个方案.它的兼容性比较好,可以很好地和GraphQL客户端进行兼容.同时它可以 独立作为服务端进 ...

  6. React:JSX 深入

    React入门的的时候,我们(我自己啦)喜欢都跟着例子来,用标签的语法写JSX,比如:<Mycomponent  key={this.props.id}  onClick={this.props ...

  7. Django数据库表初始化缓存清除

    新建的django项目中没有应用app01??? models中也没有UserInfo表???? 但在migrate是却一直报错!!!!! 产生此种现象的原因: 之前的项目中肯定是用到过应用app01 ...

  8. mysql小白系列_12 sysbench

    压测 1.查看机器负载load top - load average 1m 5m 15m cat /proc/loadavg 与CPU个数有关,1个load表示1个CPUcat /proc/cpuin ...

  9. LightOJ1030 Discovering Gold

    题目链接:https://vjudge.net/problem/LightOJ-1030 知识点: 概率与期望 解题思路: 设某一个点 \(i\) 能到达的点的个数为 \(x\),其上有金 \(g\) ...

  10. 同一父进程下的子进程之间的通信(pipe通信)

    首先对于fork命令  通过fork命令创建进程 父进程返回子进程id 子进程返回0 失败返回-1 对于pipe通讯机制   pipe通讯是半双工的 也就是说只能一方读一方写 题目中想要P1的输出作为 ...