use defaultProps

Author: mocheng

chapter-02/demo/src/ControlPanel.js

@@ -10,7 +10,7 @@ class ControlPanel extends Component {
   render() {
     return (
       <div style={style}>
-        <Counter caption="First" initValue={0} />
+        <Counter caption="First" foo/>
         <Counter caption="Second" initValue={10} />
         <Counter caption="Third" initValue={20} />
       </div>

chapter-02/demo/src/Counter.js

@@ -13,7 +13,7 @@ class Counter extends Component {
     this.onClickDecrementButton = this.onClickDecrementButton.bind(this);
 
     this.state = {
-      count: props.initValue || 0
+      count: props.initValue
     }
   }
 
@@ -37,5 +37,14 @@ class Counter extends Component {
   }
 }
 
+Counter.propTypes = {
+  caption: PropTypes.string.isRequired,
+  initValue: PropTypes.number
+};
+
+Counter.defaultProps = {
+  initValue: 0
+};
+
 export default Counter;