Default values of props in ReactJS

Question

How can I define default values in ReactJS?

var Header = React.createClass({
    render: function() {
      return (
         <h1>{this.props.title} if not defined insert "Title"</h1>
      )
    }
});

I extremely increased my React skill and as of 2018 this example (I wrote at the question body) is outdated. You should do it like @VladyVeselinov shown at the picture using ES6 classes and babel transforms like babel-class-properties that allow you to make static fields for your components

A cleaner way of writing components may be using ES6? i.imgur.com/7EHQRdl.png — Vlady Veselinov
– Vlady Veselinov, Commented Dec 10, 2016 at 3:58
I extremely increased my React skill and as of 2018 this example (I wrote at the question body) is outdated. You should do it like @VladyVeselinov shown at the picture using ES6 classes and babel transforms like babel-class-properties that allow you to make static fields for your components — IC_
– IC_, Commented Oct 25, 2018 at 23:33

Marc Bernstein · Accepted Answer · 2016-12-10 03:50:35Z

5

Since your example uses the createClass version of creating a component, you can use the getDefaultProps function.

https://facebook.github.io/react/docs/react-without-es6.html#declaring-prop-types-and-default-props

 getDefaultProps: function() {
    return {
      title: 'Title'
    };
  }

answered Dec 10, 2016 at 3:50

Marc Bernstein

1105 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Default values of props in ReactJS

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related