In the code editor, take a look at MessageDisplayer
‘s render function.
Notice the expression this.props.message
. From this expression, you can deduce that MessageDisplayer
expects to get passed a prop
named message
. Somewhere, at some time, this code is expected to execute:
<MessageDisplayer message="something" />
If a component class expects a prop
, then you can use propTypes
for that component class!
In order to start using propTypes
, we need to import the 'prop-types'
library.
import PropTypes from 'prop-types';
Then, you can declare propTypes
as a static property for your component after the component has been defined. See the example of a propTypes
property on lines 11-13. Notice that the value of propTypes
is an object, not a function!
The second step is to add properties to the propTypes
object. For each prop
that your component class expects to receive, there can be one property on your propTypes
object.
MessageDisplayer
only expects one prop
: message
. Therefore, its propTypes
object only has one property.
Instructions
Select BestSeller.js.
Import the 'prop-types'
library as PropTypes
on line 2.
Give the BestSeller
component class a propTypes
property. For now, set propTypes
equal to an empty object literal.