anuj
anuj

Reputation: 21

TypeError: Cannot read property 'isRequired' of undefined

I am new in React.js. I am trying to validate the propTypes but it shows the error "TypeError: Cannot read property 'isRequired' of undefined". I will be Thankful for the suggestions.

import React from "react";
import classnames from "classnames";
import PropTypes from "prop-types";

const TextFieldGroup = ({
  name,
  palceholder,
  value,
  label,
  error,
  info,
  type,
  onChange,
  disabled
}) => {
  return (
    <div className="form-group">
      <input
        type={type}
        className={classnames("form-control form-control-lg", {
          "is-invalid": { error }

      {error && <div className="invalid-feedback">{error}</div>}
    </div>
  );
};

TextFieldGroup.propTypes = {
  name: PropTypes.string.isRequired,
  palceholder: PropTypes.string,
  value: PropTypes.string.isRequired,
  label: PropTypes.string,
  error: PropTypes.string,
  info: PropTypes.string,
  type: PropTypes.string.isRequired,
  onChange: PropTypes.func.isRequired,
  disabled: PropTypes.string
};

TextFieldGroup.defaultProps = {
  type: "text"
};

export default TextFieldGroup;

Upvotes: 2

Views: 5968

Answers (4)

dearamerican
dearamerican

Reputation: 31

My mistake was as follows:

// **BAD**
StatusUpdate.propTypes = {
   loading: PropTypes.boolean.isRequired
};

boolean is not an available type; it's bool. smh.

So change to:

// **GOOD**
StatusUpdate.propTypes = {
   loading: PropTypes.bool.isRequired
};

Upvotes: 2

Wanlu
Wanlu

Reputation: 11

My mistake was that it was not install correctly the prop-types library,I fixed the problem after reinstallation $ npm i [email protected]

Upvotes: 1

trokiize
trokiize

Reputation: 69

Are you sure the error is located in this component? I had the same error because of this:

  EmptySearchResults.propTypes = {
      searchMessage: PropTypes.message.isRequired
  };

Because message is not a propType.

Upvotes: 0

Anil Kumar
Anil Kumar

Reputation: 2309

Import should be like this.

import {PropTypes} from "prop-types";

Upvotes: 4

Related Questions