PropTypes form is marked as required

So, I'm trying to add a shape to my component objects. The object is loaded from the server, so it is not there from the very beginning. But when I add the form to Proptypes. He continues to throw an error so that it is marked as required, but it is not.

automatically adds shapeor objectOfvalue isRequired?

TopicsList.propTypes = {
  topicsObject: PropTypes.shape(reportsTopicsObjectResultShape),
};

And the figures:

export const reportsTopicObject = PropTypes.shape({
 avg_rating_ord: PropTypes.number,
 cards_with_comments: PropTypes.number,
 cards_without_comments: PropTypes.number,
 number_of_questions: PropTypes.number,
 rating_count: PropTypes.number,
 scale_version_id: PropTypes.string,
 scale_id: PropTypes.string,
 last_answered_at: PropTypes.string,
 id: PropTypes.string,
 type: PropTypes.string,
 name: PropTypes.shape(translatedObjectSystem),
 description: PropTypes.shape(translatedObjectSystem)
});

export const reportsTopicsObjectResultShape = PropTypes.shape({
 topics_distribution: PropTypes.shape({
    general: PropTypes.number,
    groups: PropTypes.number,
    people: PropTypes.number
}),
 topic_list: PropTypes.objectOf(reportsTopicObject)
});

I'm still getting an error

Failed prop type: The prop `topicsObject.isRequired` is marked as 
required in `TopicsList`, but its value is `undefined`.

It is true that at the beginning of undefined this is normal, but I do not want this to be required

+4
source share
1 answer

Neither the form nor objectOf forces to skip the prop by default. Here is an example, directly from reacting to documents :

// An object with property values of a certain type
  optionalObjectOf: PropTypes.objectOf(PropTypes.number),

// An object taking on a particular shape
  optionalObjectWithShape: PropTypes.shape({
    color: PropTypes.string,
    fontSize: PropTypes.number
  }),

, , , ( .isRequired at ).

, . :

"Warning: Failed prop type: The prop `foo` is marked as required in `App`, but its value is `undefined`.
in App"

foo not foo.isRequired. , ,

prop `topicsObject.isRequired` 

- , /.

+1

Source: https://habr.com/ru/post/1694358/


All Articles