如何解决在React Material-UI CardMedia组件中自动播放视频
我有一个Material UI Card component,我想包含一个自动播放的视频(webm)。 (这是静音视频)
CardMedia component的文档指示要列出任何HTML元素作为组件元素类型-因此,我列出了“视频”。
我尝试了以下建议:Video autoplay not working - Trying to find a fix
具体来说,我尝试添加component: 'video autoPlay muted
无济于事-收到无法创建元素的错误。我还尝试传递一个实际标签:<video autoPlay muted>
...也失败了(“期望字符串”)。
<Card className={classes.root} raised={true}>
<CardHeader
title={camera.cameraName}
/>
<CardActionArea>
<CardMedia
component='video'
className={classes.media}
image={"path/to/file/video.webm"}
/>
<CardContent>
<Typography variant="body2" color="textSecondary" component="p">
Some Text
</Typography>
</CardContent>
</CardActionArea>
</Card>
关于如何在MaterialUI CardMedia组件中自动播放视频的任何建议?
或者,我只希望默认情况下显示控件-就这样,您必须右键单击并选择“显示控件”。
解决方法
React Material UI CardMedia video component not playing使我想到CardMedia似乎只是将属性传递给“父级”组件(在这种情况下为标签)
这样,我能够向CardMedia添加一个'autoPlay'属性,并且该属性可以正常工作。
<CardMedia
component='video'
className={classes.media}
image={"path/to/file/video.webm"}
autoPlay
/>
请注意,添加“控件”也会为视频添加控件。
,另外,如果使用iframe组件对其他人有帮助,您可以在URL中将allow="autoPlay"
与?autoplay=1&mute
结合使用,它将起作用:
<CardMedia component="iframe" src={video} allow="autoPlay"/>
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。