From 423a248c500c7f0753e213622f9918516c19ad1e Mon Sep 17 00:00:00 2001 From: Ran Yitzhaki Date: Thu, 1 Feb 2018 21:52:43 +0200 Subject: [PATCH] Note about special props in PropTypes typechecking --- content/warnings/special-props.md | 15 ++++++++++++++- 1 file changed, 14 insertions(+), 1 deletion(-) diff --git a/content/warnings/special-props.md b/content/warnings/special-props.md index cdd6b265..2c3adab7 100644 --- a/content/warnings/special-props.md +++ b/content/warnings/special-props.md @@ -6,4 +6,17 @@ permalink: warnings/special-props.html Most props on a JSX element are passed on to the component, however, there are two special props (`ref` and `key`) which are used by React, and are thus not forwarded to the component. -For instance, attempting to access `this.props.key` from a component (eg. the render function) is not defined. If you need to access the same value within the child component, you should pass it as a different prop (ex: ``). While this may seem redundant, it's important to separate app logic from reconciling hints. +For instance, attempting to access `this.props.key` from a component (eg. the render function) is not defined. If you need to access the same value within the child component, you should pass it as a different prop (ex: ``). While this may seem redundant, it's important to separate app logic from reconciling hints. + +> Note: +> +> There is no need to validate special props using [PropTypes typechecking](https://reactjs.org/docs/typechecking-with-proptypes.html#proptypes). +> +> By defining `key` or `ref` PropTypes, React will try to access them during props validation phase in the development build. +> +> ```js +> ListItemWrapper.propTypes = { +> id: PropTypes.string, +> key: PropTypes.string // WARNING +> } +> ```