propTypes use in react and some ways to avoid 😫🔧 Errors

import React,{Component} from  'react';
import propTypes from 'prop-types';
class TodoItem extends Component{
  render(){
      return(
<div>
<p>{this.props.todo.title}</p>

</div>
      )
  }
}

//proptypes used for what type of data need to be render out there in your code🔽🕶
TodoItem.propTypes={
    todo:propTypes.object.isRequired
}

export default TodoItem;

Mostly propTypes used to for rendering correct data means when you have to render number/object/array at that particular instance of code then you can do that thing by using propTypes. and that's all i know. and most important below🔽🔧 and if you have something more then please comment🔽

Mostlyall developers including big youtubers

they use this&done mistake👉 import PropTypes from 'prop-types';
but for avoiding the errors we have to use 🔽

import propTypes from 'prop-types';

use propTypes and find issue related this hereClickMe🕶

Stay safe/clean God bless you all
follow Me On twitter

Comments

[Scott Wagner]

hey, that issue mentioned on github is actually due to the way that the proptypes are added to the component, it's not an issue with the import.

this is good:

TodoItem.propTypes = {
  // whatever proptypes
}

this is not:

TodoItem.PropTypes = {
    // whatever proptypes
}

[Kyle Johnson]

Really nice to help people out here with the post :), but just to avoid confusion here, Scott is correct.

The article states the problem is with

import propTypes from 'prop-types';

This is not the case. the problem was simply React components expose a property propTypes, not PropTypes. For example, one could still write:

import PropTypes from 'prop-types';
...
MyComponent.propTypes ={
 mySuperProp: PropTypes.string.isRequired.
}

That part doesn't matter as you can declare whatever variable name you wish here.

[Aleksandr Hovhannisyan]

Laughs in TypeScript :)

[Francesco Ciulla]

nice article thanks :)

[krishna kakade]

welcome brother❤🕶 looking forward for more articles