# @dhis2/prop-types 中文文档

规范地址：https://npmcn.com/package/%40dhis2/prop-types/

版本：3\.1\.2
npm 元数据更新时间：2024-01-03T16:28:34.606Z
中文译文更新时间：2026-11-12T06:16:52.134Z
软件包许可：BSD-3-Clause

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

原始 npm 页面：https://www.npmjs.com/package/%40dhis2/prop-types
原文对照：https://npmcn.com/package/%40dhis2/prop-types/?lang=original
项目主页：https://github.com/dhis2/prop-types#readme
源码仓库：https://github.com/dhis2/prop-types

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

- 包体积（解压后）：130 kB，48 个文件
- 模块格式：ESM + CJS
- TypeScript 类型：未声明
- 运行依赖：0 个
- peer 依赖：prop-types ^15
- 首次发布：2019-07-15T16:12:11.132Z
- 最新版本发布：2022-05-24T12:48:22.018Z
- 近 30 天下载量：16246（2026-10-12 至 2026-11-10，npm 官方下载统计）
- 已发布版本数：29（近 12 个月 0 个）

## 中文简介

这个软件包包含了跨 Dhis2 应用程序和库使用的常见道具类型.

## 安装

```sh
npm install @dhis2/prop-types
```

也可以使用：`pnpm add @dhis2/prop-types`、`yarn add @dhis2/prop-types`、`bun add @dhis2/prop-types`

## README

# DHIS2 丙类

这个软件包包含了跨 Dhis2 应用程序和库使用的常见道具类型.

## 安装

```bash
yarn add @dhis2/prop-types
```

## 可用道具类型

## 职能

[阵列 With Length( \[min\], \[最大\], \[propType\])](https://npmcn.com/package/%40dhis2/prop-types/#readme-arrayWithLength) ⇒ `Error` | `null`

确保道具值是最小和最大之间的数组. 如果有第三个 `propType` 参数被传递到数组中的每个项目都需要是该正则类型

[条件( propType)](https://npmcn.com/package/%40dhis2/prop-types/#readme-conditional) ⇒ `Error` | `null`

有条件地确定通过道具上的道具类型

[组件实例( 组件)](https://npmcn.com/package/%40dhis2/prop-types/#readme-instanceOfComponent) ⇒ `Error` | `null`

确保道具值是一个特定组件的实例

[互通性( 偏好命名, propType)](https://npmcn.com/package/%40dhis2/prop-types/#readme-mutuallyExclusive) ⇒ `Error` | `null`

确保特定列表中只有一个财产节俭 此函数还会检查当前属性值是否属于指定类型

[需要如果( 姊妹方案) Name](https://npmcn.com/package/%40dhis2/prop-types/#readme-requiredIf) ⇒ `Error` | `null`

确保道具在给定的兄弟姐妹道具时有值(即按需要处理) 也有一个值,并确保道具是正确的道具型

## 阵列 With Length( \[min\], \[max\], \[propType\]\] \* `Error` | `null`

确保道具值是最小和最大之间的数组. 如果有第三个 `propType` 参数被传递到数组中的每个项目都需要是该正则类型

**仁爱**:全球职能  
**回返**数字 : `Error` | `null` - 如果满足所有条件或错误,返回无效

| 参数 | 类型 | 默认 | 说明 |
| --- | --- | --- | --- |
| \[ | `number` | `0` | 最小阵列长度 |
| \[最大\] | `number` | `Infinity` | 最大数组长度 |
| \[道具\] | `function` |  | 每个阵列项目需要符合的道具类型 |

**示例**

```js
import React from 'react'
import { arrayWithLength } from '@dhis2/prop-types'

const LotsOfLists = (props) => <div {...props}>Does nothing</div>

LotsOfLists.propTypes = {
    arrayWithMaxThreeNumbers: arrayWithLength(0, 3, propTypes.number),
    arrayWithAtLeastSixStrings: arrayWithLength(6, undefined, propTypes.string),
    arrayWithAtLeastTenItems: arrayWithLength(10),
    mandatoryArrayBetweenOneAndTen: arrayWithLength(1, 10).isRequired,
}
```

## 条件( propTypes) @% `Error` | `null`

以一个/几个通过道具的值确定道具的道具类型. 这将限制 propType 相对于 `oneOfType`。 。 。 .

**仁爱**:全球职能  
**回返**数字 : `Error` | `null` - 如果满足所有条件或错误,返回无效

| 参数 | 类型 | 默认 | 说明 |
| --- | --- | --- | --- |
| propType 道具 | `Function` |  | 决定实际道具类型的函数 |

**示例**

```js
import React from 'react'
import { conditional } from '@dhis2/prop-types'

const Select = ({ multiple, selected: _selected, options }) => {
    const selected = multiple ? _selected : [ _selected ]

    return (
        // ...
    )
}

const option = propTypes.shape({
    value: propTypes.string.isReuqired,
    labe: propTypes.string.isReuqired,
})

LotsOfLists.propTypes = {
    // ...
    options: propTypes.arrayOf(option).isRequired,
    selected: conditional(
        props => props.multiple ? propTypes.arrayOf(option) : option
    ).isRequired,
    // ...
}
```

## 组件实例 `Error` | `null`

确保道具值是一个特定组件的实例

**仁爱**:全球职能  
**回返**数字 : `Error` | `null` - 如果满足所有条件或错误,返回无效

| 参数 | 类型 | 说明 |
| --- | --- | --- |
| 构成部分 | `function` | `string` | 所期望的构成部分。 可以是反应组件,也可以是内置组件的字符串,如"span","div"等. |

**示例**

```js
import React from 'react'
import { instanceOfComponent } from '@dhis2/prop-types'
import { Button } from './Button'

const ButtonWrap = ({ children }) => <div>{children}</div>
// This would allow the ButtonWrap to be empty
ButtonWrap.propTypes = {
    children: instanceOfComponent(Button),
}

// Enforce presence of a Button instance
ButtonWrap.propTypes = {
    children: instanceOfComponent(Button).isRequired,
}

// Enforce presence of a multiple children, all Button instances
ButtonWrap.propTypes = {
    children: proptypes.arrayOf(instanceOfComponent(Button)).isRequired,
}
```

## 互通性( 偏好性命名, propType) @% `Error` | `null`

确保特定列表中只有一个财产节俭 此函数还会检查当前属性值是否属于指定类型

**仁爱**:全球职能  
**回返**数字 : `Error` | `null` - 如果满足所有条件或错误,返回无效

| 参数 | 类型 | 说明 |
| --- | --- | --- |
| 流出性方法名称 | `array.<string>` | 要检查的道具名称 |
| propType 软件 | `function` | 当前的相干值需要符合的相干类型 |

**示例**

```js
import React from 'react'
import cx from 'classnames'
import propTypes from 'prop-types'
import { mutuallyExclusive } from '@dhis2/prop-types'

const Alert = ({ danger, warning, success, children }) => (
    <div className={cx({ danger, warning, success })}>{children}</div>
)

const statusPropType = mutuallyExclusive(
    ['danger', 'warning', 'success'],
    propTypes.bool
)

Alert.propTypes = {
    children: propTypes.node,
    danger: statusPropType,
    warning: statusPropType,
    success: statusPropType,
}
```

## 如果( 姊妹方案Name ) @% 1 `Error` | `null`

确保道具在给定的兄弟姐妹道具时有值(即按需要处理) 也有一个值,并确保道具是正确的道具型

**仁爱**:全球职能  
**回返**数字 : `Error` | `null` - 如果满足所有条件或错误,返回无效

| 参数 | 类型 | 说明 |
| --- | --- | --- |
| 兄妹计划Name | `function` | 兄弟姐妹道具的名称 |

**示例**

```js
import React from 'react'
import { requiredIf } from '@dhis2/prop-types'

const Test = ({ someBool, someString }) => (
    <div>
        <h1>someBool: {someBool ? 'true' : 'false'}</h1>
        <h1>someString: {someString}</h1>
    </div>
)
Test.propTypes = {
    someBool: propTypes.bool,
    someString: requiredIf((props) => props.someBool, propTypes.string),
}
```

## 移动到 `@dhis2/prop-types` 五.3

### 变化摘要

`@dhis2/prop-types` 曾直接依赖 `prop-types` 库和再出口其出口:

-   在v1中,我们曾导出一个包含所有正则道具型和DHIS2自定义道具型的默认对象. 我们还将所有普通和定制的道具型作为命名的出口品.
-   在v2中,我们采取了一种略有不同的做法:
    -   DHIS2自定义道具型号作为命名出口提供
    -   默认导出是一个包含所有自定义道具类型的对象
    -   常规道具型是通过 `PropTypes` 导出
-   而现在在v3,我们不再出口 从什么 `prop-types` 软件包。 相反,我们只是将我们自己的自定义道具型功能暴露为命名出口.

### 从 v1 移到 v3

这些步骤是:

1.  安装版本 v3. 0.0, 例如运行 `yarn upgrade @dhis2/prop-types --latest`。确保 `package.json` 有条目 `"@dhis2/prop-types": "^3.x.x"`
2.  为新版本准备文件, 运行此版本提供的代码:
    -   确保最新版本 `@dhis2/cli` 已安装.
    -   通过运行确保代码模块可用 :
        
        ```
        d2 utils codemod list
        ```
        
        你应该看看 `@dhis2/prop-types:prop-types-v1-v3.js` 列出.
    -   通过运行应用代码模块 :
        
        ```
        d2 utils codemod apply @dhis2/prop-types:prop-types-v1-v3.js **/*.js`
        ```
        
3.  确保 `prop-types` 软件包在 `package.json`。 。 。 .
4.  扫描项目从 `@dhis2/prop-types` (开展全球搜索) `from '@dhis2/prop-types'` {\\fn黑体\\fs22\\bord1\\shad0\\3ahbe\\4ah00\\fscx67\\fscy66\\2chffffff\\3ch808080}会把戏的.
    -   如果遇到任何这种进口,项目仍需要这种依赖.
    -   极有可能,搜索不会产生任何结果,这意味着 `@dhis2/prop-types` 应去除依赖.

### 从v2 移到v3

没有可转换组件文件的编码器,但这应该是相当直接的:

1.  替换 `import { PropTypes } from '@dhis2/prop-types'` 与 `import PropTypes from 'prop-types'`。 。 。 .
2.  前一步应正确更新工程中的大部分组件文件. 如果仍有组件文件从 `@dhis2/prop-types`,那么这些文件可能实际上是使用DHIS2自定义道具类型,这些文件应该单独处理.

组件文件更新后,依存于 `package.json` 需要按照v1 - > 3迁移部分第3和第4步所示的同样方式,尽可能地更新.

## 报告问题

问题跟踪器可见于 [DHIS2 吉拉](https://jira.dhis2.org/) 下划线 [液态](https://jira.dhis2.org/projects/LIBS) 项目.

深链接 :

-   [错误](https://jira.dhis2.org/secure/CreateIssueDetails!init.jspa?pid=10700&issuetype=10006&components=11008)
-   [特性](https://jira.dhis2.org/secure/CreateIssueDetails!init.jspa?pid=10700&issuetype=10300&components=11008)
-   [任务](https://jira.dhis2.org/secure/CreateIssueDetails!init.jspa?pid=10700&issuetype=10003&components=11008)

## 常见问题

### @dhis2/prop-types 是什么？

这个软件包包含了跨 Dhis2 应用程序和库使用的常见道具类型\.

### 如何安装 @dhis2/prop-types？

在项目目录运行 npm install @dhis2/prop-types，或使用 pnpm add / yarn add / bun add。它还需要宿主项目提供 peer 依赖：prop-types（^15）。npm 7 及以上与 pnpm 8 及以上默认会自动安装必需的 peer 依赖，Yarn 需要手动安装。

### @dhis2/prop-types 支持 TypeScript 吗？

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

### @dhis2/prop-types 支持 ESM 还是 CommonJS？

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

### @dhis2/prop-types 可以商用吗？

@dhis2/prop-types 使用 BSD-3-Clause 许可。宽松许可：允许商业使用、修改和再分发，通常只需在分发时保留原版权与许可声明。另外不得用原作者名义为衍生产品背书。以上为概括，不构成法律意见，请以许可原文为准。

### @dhis2/prop-types 的下载量有多少？

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

### @dhis2/prop-types 还在维护吗？

最新版本 3\.1\.2 发布于 2022/05/24（4 年前）；至今共发布 29 个版本，其中过去 12 个月发布了 0 个；首次发布于 2019/07/16。发布频率只是参考信号：功能稳定的工具可能很少需要更新，建议结合源码仓库的 issue 和提交记录判断。

