萨姆米德游戏按钮 - 
说明
这个 PlayButton 组件生成带有“video”或“autio”图标和可选持续时间时间戳的按钮。 显示的图标由 type 道具 (英语). 组件默认显示“ video” 图标 。 本部分有显示持续时间戳的选项,如果不提供,则将优雅无用。 点击时,函数传递给 onClick 将召入.
安装
npm install @bbc/psammead-play-button
道具
| 参数 | 类型 | 需求 | 默认 | 示例 |
|---|---|---|---|---|
| 服务 | 字符串 | 对 | 不详 | 'news' |
| 标题 | 字符串 | 对 | 不详 | 'Foo.' |
| 点击 | 函数 | 对 | 不详 | () => {} |
| 会期 | 字符串 | 没有 | null | '2:30' |
| 持续时间 | 字符串 | 没有 | null | '2 minutes 30 seconds' |
| 约会时间 | 字符串 | 没有 | null | 'PT2M30S' |
| 类型 | 字符串 | 没有 | 'video' | 'audio' |
| 类Name | 字符串 | 没有 | null | 'bar' |
| 指导 | 字符串 | 没有 | null | 'Contains strong language.' |
支助 type编号
'video''audio'
使用量
这个组件的典型用法是向用户说明媒体资产占位符包含可玩媒体,即"视频"或"音频",如果适用的话,其持续时间. 触发回放的函数将传递给按钮 onClick 道具 (英语).
import PlayButton from '@bbc/psammead-play-button';
<PlayButton
service="news"
title="Dog barks at cat."
onClick={handleClick}
duration="2:30"
durationSpoken="2 minutes 30 seconds"
datetime="PT2M30S"
type="audio"
guidanceMessage="Contains strong language."
/>;
何时使用此组件
这个 PlayButton 组件设计用于含有可播放介质的媒体资产占位符。 它向用户表示期望"video"或"adio"的内容,以及如果适用的话其持续时间.
无障碍说明
预计这一构成部分将为屏幕阅读器和其他辅助技术提供关于可播放媒体的信息。 媒体的名称必须传递给 title 道具,如果需要显示持续时间,则使用方便人的版本 durationSpoken。如果视频有指导信息,在静态文本中也会读出这些信息。 用于构建字符串, 以 视觉 隐藏文字 键。 图标标记为 aria-hidden="true",这意味着它应该被屏幕阅读器忽略.
捐款
Psammead完全开源. 我们感谢任何贡献,无论是新的组件、错误修正还是总体改进。 请参看我们的主要贡献指南,可查阅: psammead 仓库的根。 。 。 .
行为守则
我们欢迎对这项工作的反馈和帮助。 通过参与这个项目,你同意遵守 行为守则请稍候再读一下.
许可证
萨姆米德 Apache 2.0 许可。 。 。 .