Trusted answers to developer questions
Trusted Answers to Developer Questions

Related Tags

react

How to set default props in React

Nouman Abbasi

Props in React are like function arguments. You can use props to send data to a component.

Like default values for function arguments, props also have default values.

defaultProps can be defined as a property on the component class itself to set the default props for the class.

defaultProps is used for undefined props, not for null props.

Code

For example, let’s create a CustomButton class in React that takes color as a prop.

To set a default value for the color prop, use the defaultProps property of CustomButton to set the default value of color to blue.

Notice that whenever you don’t pass the color prop to CustomButton, it will fall back to the blue default prop value.

import React from 'react';
require('./style.css');

import ReactDOM from 'react-dom';
import App from './app.js';


ReactDOM.render(
  <App />, 
  document.getElementById('root')
);

RELATED TAGS

react

CONTRIBUTOR

Nouman Abbasi
Copyright ©2022 Educative, Inc. All rights reserved
RELATED COURSES

View all Courses

Keep Exploring