首页
学习
活动
专区
圈层
工具
发布
社区首页 >专栏 >Gatsby 中怎么加载使用视频文件?

Gatsby 中怎么加载使用视频文件?

原创
作者头像
Learn-anything.cn
发布于 2021-12-02 08:48:52
发布于 2021-12-02 08:48:52
1.2K0
举报
文章被收录于专栏:learn-anything.cnlearn-anything.cn
一、简介

Gatsby 项目中怎么播放视频?

二、解决方案
1、HTML5 <video>

使用 HTML5 的 video 标签,播放 本地视频 和 远程视频。

代码语言:txt
复制
import * as React from 'react'
import dog from '../assets/dog.mp4'

const VideoShow = () => {

    return (
        <div>
            <video width="70%" controls>
                <source src={dog} type="video/mp4" />
            </video>

            <video width="70%" controls>
                <source src="https://api.learn-anything.cn/uploads/dog_14be0bfb5a.mp4" type="video/mp4" />
            </video>
        </div>
    )
}

export default VideoShow;
三、参考文档

原创声明:本文系作者授权腾讯云开发者社区发表,未经许可,不得转载。

如有侵权,请联系 cloudcommunity@tencent.com 删除。

目录
  • 一、简介
  • 二、解决方案
    • 1、HTML5 <video>
  • 三、参考文档
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档