# @bbc/psammead-radio-schedule 中文文档

规范地址：https://npmcn.com/package/%40bbc/psammead-radio-schedule/

版本：5\.1\.35
npm 元数据更新时间：2026-04-16T10:49:22.618Z
中文译文更新时间：2026-11-07T19:09:40.014Z
软件包许可：Apache-2\.0

本文由上游 README 翻译，可能存在偏差，请结合原文核对 API、命令与配置。版权与许可归原作者所有。

原始 npm 页面：https://www.npmjs.com/package/%40bbc/psammead-radio-schedule
原文对照：https://npmcn.com/package/%40bbc/psammead-radio-schedule/?lang=original
项目主页：https://github.com/BBC-News/psammead/blob/latest/packages/components/psammead-radio-schedule/README.md
源码仓库：https://github.com/BBC-News/psammead/tree/latest/packages/components/psammead-radio-schedule

弃用说明：This package is no longer maintained\.

## 关键信息（来自 npm 元数据）

- 包体积（解压后）：396 kB，32 个文件
- 模块格式：ESM + CJS
- TypeScript 类型：未声明
- 运行依赖：7 个
- peer 依赖：react \>=16\.9\.0，@emotion/styled ^11\.0\.0
- 首次发布：2020-01-30T14:26:15.812Z
- 最新版本发布：2021-06-21T12:39:09.303Z
- 近 30 天下载量：3049（2026-10-08 至 2026-11-06，npm 官方下载统计）
- 已发布版本数：128（近 12 个月 0 个）

## 中文简介

无线电节目各部分的组件包

## 安装

```sh
npm install @bbc/psammead-radio-schedule
```

也可以使用：`pnpm add @bbc/psammead-radio-schedule`、`yarn add @bbc/psammead-radio-schedule`、`bun add @bbc/psammead-radio-schedule`

## README

# psammead-radio-schedule - 时间轴 - [![Known Vulnerabilities](https://snyk.io/test/github/bbc/psammead/badge.svg?targetFile=packages%2Fcomponents%2Fpsammead-radio-schedule%2Fpackage.json)](https://snyk.io/test/github/bbc/psammead?targetFile=packages%2Fcomponents%2Fpsammead-radio-schedule%2Fpackage.json) [![Dependency Status](https://david-dm.org/bbc/psammead.svg?path=packages/components/psammead-radio-schedule)](https://david-dm.org/bbc/psammead?path=packages/components/psammead-radio-schedule) [![peerDependencies Status](https://david-dm.org/bbc/psammead/peer-status.svg?path=packages/components/psammead-radio-schedule)](https://david-dm.org/bbc/psammead?path=packages/components/psammead-radio-schedule&type=peer) [![Storybook](https://raw.githubusercontent.com/storybooks/brand/master/badge/badge-storybook.svg?sanitize=true)](https://bbc.github.io/psammead/?path=/story/radio-schedule--containing-image) [![GitHub license](https://img.shields.io/badge/license-Apache%202.0-blue.svg)](https://github.com/bbc/psammead/blob/latest/LICENSE) [![npm version](https://img.shields.io/npm/v/@bbc/psammead-radio-schedule.svg)](https://www.npmjs.com/package/@bbc/psammead-radio-schedule) [![PRs Welcome](https://img.shields.io/badge/PRs-welcome-brightgreen.svg)](https://github.com/bbc/psammead/blob/latest/CONTRIBUTING.md)

## 说明

这个 `RadioSchedule` 组件旨在显示不同状态的无线电节目。 目前,该构成部分包括: `ProgramCard` 内容包括:与无线电节目的链接、国家标签、品牌和插曲标题、摘要和持续时间.

## 出口

`/startTime` - 添加程序的起始时间,并设置时钟图标、时间戳和水平线.

## 安装

```jsx
npm install @bbc/psammead-radio-schedule --save
```

## 组件(WIP)

## 无线电列表

### 道具

| 参数 | 类型 | 需求 | 默认 | 示例 |
| --- | --- | --- | --- | --- |
| 附表 | 数组 | 对 | 不详 | `[{ id: '1', state: 'live', stateLabel: 'Live', startTime: '1566914061212', link: 'www.bbc.co.uk', brandTitle: 'This is a brand title', episodeTitle: 'This is an episode title', summary: 'This is a summary', duration: '45:00'}]` |
| 服务 | 字符串 | 对 | 不详 | `'news'` |
| 脚本 | 对象 | 对 | 不详 | `{ canon: { groupA: { fontSize: '28', lineHeight: '32',}, groupB: { fontSize: '32', lineHeight: '36', }, groupD: { fontSize: '44', lineHeight: '48', }, }, trafalgar: { groupA: { fontSize: '20', lineHeight: '24', }, groupB: { fontSize: '24', lineHeight: '28', }, groupD: { fontSize: '32', lineHeight: '36', }, }, }` |
| 语言 | 字符串 | 没有 | 不详 | `'en-gb'` |
| 时区 | 字符串 | 没有 | 不详 | `'Europe/London'` |
| 持续时间标签 | 字符串 | 对 | 不详 | `'Duration %duration%'` |
| 活标签 | 字符串 | 对 | 不详 | `'LIVE'` |
| 下个标签 | 字符串 | 对 | 不详 | `'NEXT'` |
| 目录 | 字符串 | 没有 | `"ltr"` | `"rtl"` |
| 链接组件 | 元素 Type QQ 字符串 | 没有 | `"a"` | `ReactRouterLink` |
| 链接 组件 | 字符串 | 没有 | `"href"` | `"to"` |

### 使用量

此组件会对所有通过的时间表显示无线电调度程序卡和起始时间组件.

```jsx
import React from 'react';
import { latin } from '@bbc/gel-foundations/scripts';
import RadioSchedule from '@bbc/psammead-radio-schedule';

const schedules = [
  {
    id: 1,
    state: 'live',
    startTime: 1566914061212,
    link: 'www.bbc.co.uk',
    brandTitle: 'This is a brand title',
    summary: 'This is a summary',
    duration: '45:00',
  },
];

<RadioSchedule
  schedules={schedules}
  locale="en-gb"
  timezone="Europe/London"
  script={latin}
  service="news"
  dir="ltr"
  liveLabel="LIVE"
  nextLabel="NEXT"
  durationLabel="Duration %duration%"
/>;
```

默认链接组件是 `a` 标记,可以替换为 [反应路由大小](https://www.npmjs.com/package/react-router-dom) `Link` 组件

```jsx
import React from 'react';
import { Link } from 'react-router-dom';
import { latin } from '@bbc/gel-foundations/scripts';
import RadioSchedule from '@bbc/psammead-radio-schedule';

const schedules = [
  {
    id: 1,
    state: 'test',
    startTime: 1566914061212,
    link: 'www.bbc.co.uk',
    brandTitle: 'This is another brand title',
    summary: 'This is a longer summary',
    duration: '30:00',
  },
];

<RadioSchedule
  schedules={schedules}
  locale="en-gb"
  timezone="Europe/London"
  script={latin}
  service="news"
  dir="ltr"
  liveLabel="LIVE"
  nextLabel="NEXT"
  durationLabel="Duration %duration%"
  linkComponent={Link}
  linkComponentAttr="to"
/>;
```

## 程序卡

### 道具

| 参数 | 类型 | 需求 | 默认 | 示例 |
| --- | --- | --- | --- | --- |
| 品牌标题 | 字符串 | 对 | 不详 | `'This is a brand title'` |
| 目录 | 字符串 | 没有 | 无效 | `'This is a summary'` |
| 会期 | 字符串 | 对 | 不详 | `'PT30M'` |
| 持续时间标签 | 字符串 | 对 | 不详 | `'Duration %duration%'` |
| 状态 | 字符串 | 对 | 不详 | `'live'` |
| 活标签 | 字符串 | 对 | 不详 | `'LIVE'` |
| 下个标签 | 字符串 | 对 | 不详 | `'NEXT'` |
| 链接 | 字符串 | 对 | 不详 | `'https://bbc.com/arabic/articles/c1er5mjnznzo'` |
| 开始时间 | 编号 | 对 | 不详 | `1566914061212` |
| 服务 | 字符串 | 对 | 不详 | `'news'` |
| 脚本 | 对象 | 对 | 不详 | `{ canon: { groupA: { fontSize: '28', lineHeight: '32',}, groupB: { fontSize: '32', lineHeight: '36', }, groupD: { fontSize: '44', lineHeight: '48', }, }, trafalgar: { groupA: { fontSize: '20', lineHeight: '24', }, groupB: { fontSize: '24', lineHeight: '28', }, groupD: { fontSize: '32', lineHeight: '36', }, }, }` |
| 目录 | 字符串 | 没有 | `"ltr"` | `"rtl"` |
| 时区 | 字符串 | 没有 | `'GMT'` | `'Europe/London'` |
| 语言 | 字符串 | 没有 | `'en-gb'` | `'fa'` |
| 链接组件 | 元素 Type QQ 字符串 | 没有 | `"a"` | `ReactRouterLink` |
| 链接 组件 | 字符串 | 没有 | `"href"` | `"to"` |

### 使用量

此组件以单一链接显示为程序卡,并有品牌标题,插曲标题,摘要和持续时间. 它还允许以类似于下列方式推翻链接组件: `RadioSchedule` 构成部分.

```jsx
import React from 'react';
import { latin } from '@bbc/gel-foundations/scripts';
import ProgramCard from '@bbc/psammead-radio-schedule/ProgramCard';

<ProgramCard
  service="news"
  script={latin}
  dir="ltr"
  startTime="13:00"
  brandTitle="This is a brand title"
  summary="Could a computer ever create better art than a human?"
  duration="PT30M"
  durationLabel="Duration %duration%"
  state="live"
  liveLabel="LIVE"
  nextLabel="NEXT"
  link="https://bbc.com/arabic/articles/c1er5mjnznzo"
  timezone="Europe/London"
/>;
```

## 开始时间

### 道具

| 参数 | 类型 | 需求 | 默认 | 示例 |
| --- | --- | --- | --- | --- |
| 时间戳 | 编号 | 对 | 不详 | `1530947227000` |
| 时区 | 字符串 | 没有 | `'Europe/London'` | `'Europe/Vienna'` |
| 语言 | 字符串 | 没有 | `'en-gb'` | `'fa'` |
| 脚本 | 对象 | 对 | 不详 | `{ canon: { groupA: { fontSize: '28', lineHeight: '32',}, groupB: { fontSize: '32', lineHeight: '36', }, groupD: { fontSize: '44', lineHeight: '48', }, }, trafalgar: { groupA: { fontSize: '20', lineHeight: '24', }, groupB: { fontSize: '24', lineHeight: '28', }, groupD: { fontSize: '32', lineHeight: '36', }, }, }` |
| 服务 | 字符串 | 对 | 不详 | `news` |
| 目录 | 字符串 | 没有 | `'ltr'` | `'rtl'` |

### 使用量

```jsx
import React from 'react';
import StartTime from '@bbc/psammead-radio-schedule/startTime';
import { latin } from '@bbc/gel-foundations/scripts';

<StartTime
  script={latin}
  service="news"
  timestamp={1566914061212}
  timezone="Europe/London"
  locale="en-gb"
  dir="ltr"
/>;
```

### 何时使用此组件

本部分最初用于 `front pages`,以及媒体页面.

### 不使用此组件时

### 无障碍说明

### 路线图

## 捐款

Psammead完全开源. 我们感谢任何贡献,无论是新的组件、错误修正还是总体改进。 请参看我们的主要贡献指南,可查阅: [psammead 仓库的根](https://github.com/bbc/psammead/blob/latest/CONTRIBUTING.md)。 。 。 .

### [行为守则](https://github.com/bbc/psammead/blob/latest/CODE_OF_CONDUCT.md)

我们欢迎对这项工作的反馈和帮助。 通过参与这个项目,你同意遵守 [行为守则](https://github.com/bbc/psammead/blob/latest/CODE_OF_CONDUCT.md)请稍候再读一下.

### 许可证

萨姆米德 [Apache 2.0 许可](https://github.com/bbc/psammead/blob/latest/LICENSE)。 。 。 .

## 常见问题

### @bbc/psammead-radio-schedule 是什么？

无线电节目各部分的组件包注意：该包已被作者标记为弃用——This package is no longer maintained\.

### 如何安装 @bbc/psammead-radio-schedule？

在项目目录运行 npm install @bbc/psammead-radio-schedule，或使用 pnpm add / yarn add / bun add。它还需要宿主项目提供 peer 依赖：react（\>=16\.9\.0）、@emotion/styled（^11\.0\.0）。npm 7 及以上与 pnpm 8 及以上默认会自动安装必需的 peer 依赖，Yarn 需要手动安装。

### @bbc/psammead-radio-schedule 支持 TypeScript 吗？

该包的 package\.json 没有声明类型入口。需要类型提示时，可以在 npm 上查找社区维护的 @types/bbc\_\_psammead-radio-schedule 是否存在。

### @bbc/psammead-radio-schedule 支持 ESM 还是 CommonJS？

同时提供 ES Module 与 CommonJS 入口，import 和 require\(\) 都可以使用，打包工具会自动选择合适的版本。

### @bbc/psammead-radio-schedule 可以商用吗？

@bbc/psammead-radio-schedule 使用 Apache-2\.0 许可。宽松许可：允许商业使用、修改和再分发，并附带明确的专利授权；分发时需保留许可与 NOTICE 文件，修改过的文件要注明改动。以上为概括，不构成法律意见，请以许可原文为准。

### @bbc/psammead-radio-schedule 的下载量有多少？

根据 npm 官方下载统计，@bbc/psammead-radio-schedule 在 2026/10/08 – 2026/11/06 这 30 天内被下载 3,049 次，日均约 102 次。下载量会把 CI 构建、镜像同步和作为其他包依赖的安装一并计入，适合横向比较热度，不能直接等同于使用人数。

### @bbc/psammead-radio-schedule 还在维护吗？

最新版本 5\.1\.35 发布于 2021/06/21（5 年前）；至今共发布 128 个版本，其中过去 12 个月发布了 0 个；首次发布于 2020/01/30。作者已将其标记为弃用，新项目建议寻找替代方案。