Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

请问你的全屏事件是如何监听的 虽然我知道video.js有handleFullscreenChange这个事件 但是在你的这个组件中怎么去传递呢 怎么用呢 #364

Closed
pqypqy opened this issue Jun 8, 2020 · 7 comments

Comments

@pqypqy
Copy link

pqypqy commented Jun 8, 2020

中文用户注意:

  1. 尽量用英文描述你的 issue
  2. 不要把内容堆彻在标题上,逻辑清晰地写在内容区
  3. 贴代码要提前格式化好,有颜色高亮那种,贴文本,不要贴图片
  4. 提问题前,必须仔细阅读 REMADE.md + 在已关闭的问题中寻找与自身相关的问题,90% 的可能它已经被解决
  5. 如果无法做到提一个合格、优秀的问题,则问题会被 close + block

BUG REPORT TEMPLATE

Vue.js version and component version

Reproduction Link

  • A minimal JSBin, JSFiddle, Codepen, or a GitHub repository that can reproduce the bug.
  • You could start with this template: https://jsfiddle.net/39epgLj0/

Steps to reproduce

What is Expected?

What is actually happening?

@h7ml
Copy link

h7ml commented Jun 8, 2020

+1 我也在研究这个问题,先占个坑

@h7ml
Copy link

h7ml commented Jun 9, 2020

中文用户注意:

  1. 尽量用英文描述你的 issue
  2. 不要把内容堆彻在标题上,逻辑清晰地写在内容区
  3. 贴代码要提前格式化好,有颜色高亮那种,贴文本,不要贴图片
  4. 提问题前,必须仔细阅读 REMADE.md + 在已关闭的问题中寻找与自身相关的问题,90% 的可能它已经被解决
  5. 如果无法做到提一个合格、优秀的问题,则问题会被 close + block

BUG REPORT TEMPLATE

Vue.js version and component version

Reproduction Link

  • A minimal JSBin, JSFiddle, Codepen, or a GitHub repository that can reproduce the bug.
  • You could start with this template: https://jsfiddle.net/39epgLj0/

Steps to reproduce

What is Expected?

What is actually happening?

查找相关issues 这里是注册了一个自定义按钮组件,再将其添加到播放器的 controlBar里,然后替换默认的全屏切换按钮。
所以我是修改了node_modules\_vue-video-player@5.0.2@vue-video-player\node_modules\video.js\dist里面的代码,做到监听全屏事件。

@pqypqy
Copy link
Author

pqypqy commented Jun 10, 2020

中文用户注意:

  1. 尽量用英语描述你的问题
  2. 不要把内容堆彻在标题上,逻辑清晰地写在内容区
  3. 粘贴代码要提前格式化好,有颜色高亮那种,粘贴文本,不要粘贴图片
  4. 提问题前,必须仔细阅读REMADE.md +在已关闭的问题中寻找与自身相关的问题,90%的可能它已经被解决
  5. 如果无法做到提一个合格,优秀的问题,则问题会被close + block

错误报告模板

Vue.js版本和组件版本

复制链接

  • 可以重现该错误的最小JSBin,JSFiddle,Codepen或GitHub存储库。
  • 您可以从以下模板开始:https : //jsfiddle.net/39epgLj0/

重现步骤

期望什么?

实际发生了什么?

发现相关问题此处是注册了一个自定义按钮组件,再将其添加到播放器的controlBar里,然后替换替换的全屏切换按钮。
所以我是修改了node_modules\_vue-video-player@5.0.2@vue-video-player\node_modules\video.js\dist里面的代码,做到了监听全屏事件。

我监听了页面的是否为全屏状态
document.addEventListener("fullscreenchange", function (e) {
if (document.fullscreenElement) {
console.log('进入全屏');
}
})

@Halcao
Copy link

Halcao commented Jul 10, 2020

You can get the player DOM element by $refs, and set a listener on its player property

this.$refs.player.player.on('fullscreenchange', event => {
     console.log(event)
})

@Tracy4ever
Copy link

vue里面,@fullscreenchange.native=""

@fangcongcong
Copy link

vue里面,@fullscreenchange.native=""

IOS上没有执行

@surmon-china
Copy link
Owner

The original vue-video-player package is no longer maintained, please upgrade to @videojs-player/vue.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

6 participants