React PropTypes, 'prop.attr' is missing in prop validation

Question

I am seeing a linting react/prop-type error stating that the children in an array as well as the parent value are missing from prop validation. When I add the types I still get the error. I am not sure what I am missing here, here is my current code:

type Props = {
  book: {
    name: string,
    description: any,
  },
};

type State = {};

export default class Book extends React.PureComponent<Props, State> {
    render() {
        const {
          name,
          description,
        } = this.props.book;
        
        return (
        <BookModal
          name={name}
          description={description} 
        />
    );
  }
}

As always thanks for taking a look!

score 1 · Answer 1 · answered Jul 08 '20 at 16:57

1

Thats a warning for PropTypes validation:

import PropTypes from 'prop-types';

Book.propTypes = {
  // or book: PropTypes.object 
  book: PropTypes.shape({
    color: PropTypes.string,
    fontSize: PropTypes.number,
  }),
};

See PropTypes in TypeScript, and how to disable proptypes linting (if you decide that you don't need it).

answered Jul 08 '20 at 16:57

Dennis Vash

50,196
9
100
118

For some reason this reads out as an unexpected token error. – mrtriangle Jul 08 '20 at 17:12

score 1 · Answer 2 · answered Jul 08 '20 at 17:00

If you are using prop-types you could try:

import PropTypes from 'prop-types';    
type Props = {
     book: PropTypes.shape({
       color: PropTypes.string,
       fontSize: PropTypes.number
     })
}

https://es.reactjs.org/docs/typechecking-with-proptypes.html#proptypes

React PropTypes, 'prop.attr' is missing in prop validation

2 Answers2