CODEWITHSUNDEEP
reactjsjsx
Cone
Cone

Reputation: 3

What props is for in this example

Why are "props" put in this code? I tried deleting both props and the result was the same. So, what props are for?

import React from 'react';
import ReactDOM from 'react-dom';

class Car extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      brand: "Ford",
      model: "Mustang",
      color: "red",
      year: 1964
    };
  }
  render() {
    return (
      <div>
        <h1>My {this.state.brand}</h1>
        <p>
          It is a {this.state.color}
          {this.state.model}
          from {this.state.year}.
        </p>
      </div>
    );
  }
}

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

Upvotes: 0

Views: 41

Answers (2)

Cone
Cone

Reputation: 3

Do I understand it? https://ibb.co/9ZCrdFD This is screenshot of comments in code

Upvotes: 0

John C
John C

Reputation: 1981

It's hard to guess what the author had in mind, if you can't contact them directly. But since passing along properties doesn't add overhead that wasn't already there, it's probably for either future expansion or to get the reader accustomed to seeing the props used, depending on where the example comes from.

They're not used in this component, as you point out, but most React developers I've worked with prefer to automatically include an empty props in each component when writing them, rather than remembering to go back to add the parameter and call to super() when specifically needed.

That is, for a lot of programmers, it's simpler to just make props part of every component than to risk adding a property later and being stressed when the error message shows up complaining that this.props.property is trying to access null.

Upvotes: 1

Related Questions