问题标签 [react-player]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
1 回答
564 浏览

reactjs - react-player 上传和播放新视频

我正在通过快速服务器将视频上传到反应的公共文件夹并使用钩子作为文件名。如果它是一个大的视频文件,上传后反应播放器开始正确播放。但是如果文件很小,播放器不会运行它,我必须在一段时间后重新加载它才能工作。此外,如果在大文件之后上传小文件,则会返回无法满足的错误范围。反应球员:

Axios 连接:

快递代码:

})

0 投票
0 回答
55 浏览

javascript - Vimeo 视频不适用于移动设备

我正在使用 react-player lib 在我的应用程序上加载视频,但 vimeo 视频有时无法在移动设备上运行。Youtube 视频很好,据我测试,vimeo 总是在桌面上工作。视频中断时,我在控制台上没有任何错误,如果我不断刷新应用程序,有时它会加载并正常工作。这是我为玩家准备的:

这就是视频中断时的样子

有没有人对可能是什么问题或如何解决有任何建议?我发现很多人抱怨这个问题,但他们在控制台上有错误,而我没有

0 投票
0 回答
118 浏览

reactjs - React Native Invariant Violation "Main" 尚未向 react-native-track-player 注册

我正在使用 React-native 构建一个将使用音频的应用程序。一切都正确设置并安装了最新更新。但是,每当我添加

import TrackPlayer from 'react-native-track-player'

它给了我一个错误,上面写着

Invariant Violation : "Main" has not been registered. This can happen if *Metro is run from the wrong folder...

0 投票
0 回答
682 浏览

reactjs - React-Player 在移动设备中卡在全屏模式

我使用 React-Player 作为登录页面的背景,但是当在移动设备(而不是桌面)上使用它时,它有时会(并非总是)进入全屏模式并卡在那里。

我使用的视频来自 vimeo,所以我不确定问题是我的 ReactPlayer 配置,还是 vimeo API / SDK 的问题。

0 投票
1 回答
245 浏览

javascript - ReactPlayer 高度缩放以适应更多页面

在我的页面上,我有一个视频,我想包含整个网页的屏幕。但是到目前为止,用户必须滚动一点才能到达底部,这不是我想要的。

我的 JS:

我的 CSS:

我玩弄了向视频播放器添加 CSS 属性,但没有任何效果,所以这就是为什么它现在是空的。不知道我需要调整什么。

0 投票
0 回答
105 浏览

javascript - 使用 ReactJS / Typescript / Socket.io 同步视频时出现问题

我正在开发一个应用程序作为锻炼,它具有同步用户选择的 youtube 视频的功能,为此,我使用 ReactJs、Socket.io 和 React-player,但是当我进入同步部分时,我有一个问题。

我打算执行以下操作:视频的进度时间存储在 useState 中,如果用户是房间的所有者,并且此常量每 1 秒更新一次进度,那么,在启动视频时,会触发一个 handleStartVideo 函数,该函数将因为这个用户从房间的主人那里收到了他的视频时会发现的 currentTime,但是,我的问题是:我怎么能告知要使用的 currenTime 是一个仅由所有者定义的常量房间和普通用户没有明确的价值?可以通过socket.io发送吗?

0 投票
1 回答
137 浏览

css - 如何在反应中正确定位超过 100% 的宽度

我正在使用 react-responsive-carousel 创建一个 youtube 视频轮播,如http://react-responsive-carousel.js.org/storybook/?path=/story/02-advanced--youtube-autoplay-with-自定义拇指

如图所示,我想移除两侧的黑匣子。 黑边

我用过<ReactPlayer width="100%" url={url} playing={isSelected} height="100%" />

当我尝试时,width=120%我在某种程度上得到了我想要的结果。有一个黑色的一面

有什么办法可以让视频居中,这样就可以覆盖整个区域,两边都没有黑色空间。

0 投票
1 回答
90 浏览

javascript - 如何将 onClick 功能添加到 React Js 中的特定列?

我有一个数据网格,其中有一列名为 File_link。我想向该字段添加功能,以便当用户单击该单元格时,它应该打开反应播放器并将该单元格值作为 url 传递给反应播放器。我已经创建了反应播放器和数据网格。

示例: 在此处输入图像描述 在图像中有两个链接。当用户点击任何链接时。Reactplayer 应该将该链接作为 url 值并打开反应播放器

0 投票
1 回答
3951 浏览

reactjs - React-player 在没有控件的情况下自动播放视频

我使用带有 cloudinary 的 react-player 来自动播放和循环播放没有控件的视频(所以它看起来像一个 gif)。

首选项当前设置为:

除非控件已打开并且您手动启动视频,否则视频在加载之前不会播放。

是否可以在没有控件的情况下自动启动视频?

0 投票
1 回答
1300 浏览

reactjs - 从外部组件切换全屏时取消静音反应播放器

我有一个VideoItem- 和一个 -Player组件

VideoList单击按钮并进入全屏模式(按预期工作)单击全屏时,我将取消静音播放器。

如何将“静音”更改从VideoList传递 到Player?在我的Player我还有一个“取消静音”按钮(它也按预期工作:

这是我到目前为止所拥有的

视频项.jsx

播放器.jsx

谢谢!