@@ -8,9 +8,9 @@ redirect_from:
8
8
9
9
> 注意:
10
10
>
11
- > 自 React 15 .5 起,` React.PropTypes ` 已移入另一个包中。请使用 [ ` prop-types ` ] ( https://www.npmjs.com/package/prop-types ) 库代替 。
11
+ > 自 React v15 .5 起,` React.PropTypes ` 已移入另一个包中。请使用 [ ` prop-types ` 库 ] ( https://www.npmjs.com/package/prop-types ) 代替 。
12
12
>
13
- > 我们提供了一个 [ codemod] ( /blog/2017/04/07/react-v15.5.0.html#migrating-from-reactproptypes ) 脚本来自动转换 。
13
+ > 我们提供了一个 [ codemod 脚本 ] ( /blog/2017/04/07/react-v15.5.0.html#migrating-from-reactproptypes ) 来做自动转换 。
14
14
15
15
随着你的应用程序不断增长,你可以通过类型检查捕获大量错误。对于某些应用程序来说,你可以使用 [ Flow] ( https://flow.org/ ) 或 [ TypeScript] ( https://www.typescriptlang.org/ ) 等 JavaScript 扩展来对整个应用程序做类型检查。但即使你不使用这些扩展,React 也内置了一些类型检查的功能。要在组件的 props 上进行类型检查,你只需配置特定的 ` propTypes ` 属性:
16
16
@@ -30,7 +30,7 @@ Greeting.propTypes = {
30
30
};
31
31
```
32
32
33
- ` PropTypes ` 提供一系列验证器,可用于组件接收的数据类型是有效的 。在本例中, 我们使用了 ` PropTypes.string ` 。当传入类型不正确的属性时 ,JavaScript 控制台将会显示警告。出于性能方面的考虑,` propTypes ` 只仅在开发模式下进行检查 。
33
+ ` PropTypes ` 提供一系列验证器,可用于确保组件接收到的数据类型是有效的 。在本例中, 我们使用了 ` PropTypes.string ` 。当传入的 ` prop ` 值类型不正确时 ,JavaScript 控制台将会显示警告。出于性能方面的考虑,` propTypes ` 仅在开发模式下进行检查 。
34
34
35
35
### Prop 类型 {#proptypes}
36
36
@@ -40,7 +40,8 @@ Greeting.propTypes = {
40
40
import PropTypes from ' prop-types' ;
41
41
42
42
MyComponent .propTypes = {
43
- // 你可以将属性声明为 JS 原生类型,默认情况下这些属性都是可选的。
43
+ // 你可以将属性声明为 JS 原生类型,默认情况下
44
+ // 这些属性都是可选的。
44
45
optionalArray: PropTypes .array ,
45
46
optionalBool: PropTypes .bool ,
46
47
optionalFunc: PropTypes .func ,
@@ -49,28 +50,29 @@ MyComponent.propTypes = {
49
50
optionalString: PropTypes .string ,
50
51
optionalSymbol: PropTypes .symbol ,
51
52
52
- // 任何可被渲染的元素(包括数字、字符串、子元素或数组 )
53
- // ( 或 Fragment) 也包含这些类型。
53
+ // 任何可被渲染的元素(包括数字、字符串、元素或数组 )
54
+ // ( 或 Fragment) 也包含这些类型。
54
55
optionalNode: PropTypes .node ,
55
56
56
- // 一个 React 元素
57
+ // 一个 React 元素。
57
58
optionalElement: PropTypes .element ,
58
59
59
- // 你也可以声明属性为某个类的实例,这里使用 JS 的 instanceof 操作符。
60
+ // 你也可以声明 prop 为类的实例,这里使用
61
+ // JS 的 instanceof 操作符。
60
62
optionalMessage: PropTypes .instanceOf (Message),
61
63
62
- // 你可以使你的属性只接收指定的值。
63
- // 这是一个枚举类型 。
64
+ // 你可以让你的 prop 只能是特定的值,指定它为
65
+ // 枚举类型 。
64
66
optionalEnum: PropTypes .oneOf ([' News' , ' Photos' ]),
65
67
66
- // 指定的多个对象类型中的一个
68
+ // 一个对象可以是几种类型中的任意一个类型
67
69
optionalUnion: PropTypes .oneOfType ([
68
70
PropTypes .string ,
69
71
PropTypes .number ,
70
72
PropTypes .instanceOf (Message)
71
73
]),
72
74
73
- // 一个指定类型组成的数组
75
+ // 可以指定一个数组由某一类型的元素组成
74
76
optionalArrayOf: PropTypes .arrayOf (PropTypes .number ),
75
77
76
78
// 一个指定类型属性构成的对象
0 commit comments