CODEWITHSUNDEEP
javascriptreactjs
Mark James
Mark James

Reputation: 558

Why is React saying “Invalid prop `children`” types is object not function?

I have problem with prop-types. Warning message appear which said that children is object not a function.

But when I change that in object I have problem with npm Lint.

Which says that cannot be type of object.

How to avoid this issue?

Component code:

import propTypes from 'prop-types';
import * as React from 'react';

export default function layout({ children, title }) {
  return (
    <div className="root">

      <h2>{title}</h2>

      {children}

    </div>
  );
}

layout.propTypes = {
  children: propTypes.func.isRequired,
  title: propTypes.string.isRequired
};

Warrning message:

Warning: Failed prop type: Invalid prop children of type object supplied to layout, expected function. in layout in Index in Container in App in Context.Provider in Context.Provider in Context.Provider in Context.Provider

Upvotes: 0

Views: 531

Answers (1)

wodwin
wodwin

Reputation: 69

The react children props is not a function its sort of an object.

try this: children: PropTypes.element.isRequired

Upvotes: 2

Related Questions