Specifying default props

"Shawn, React also allows us to define some default values for props. This is useful when parent component is passing props based on some condition or not passing some props at all due to some change," Mike said.

var App = React.createClass({

 getDefaultProps: function() {
    return {
      headings: ['When happened ', 'Who did it', 'What they change']
    };
  },
  
  render: function(){
            …
  }
});

var data = [{ "when": "2 minutes ago",
              "who": "Jill Dupre",
              "description": "Created new account"
            },
            {
              "when": "1 hour ago",
              "who": "Lose White",
              "description": "Added first chapter"
            }];

React.render(<App changeSets={data}/>, document.body);

"Here, we updated the code to not send the headings from props. Instead, we used the getDefaultProps function to define the default props that will be used in case they are not passed."

Specifying default props

"Therefore, our output looks like this."

"Oh, ok. Makes sense. Rather than fiddling with the if-else clauses to check whether the prop is present, default props make it simple enough to predefine our data." said Shawn.

..................Content has been hidden....................

You can't read the all page of ebook, please click here login for view all page.
Reset