Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Prop type object if forbidden [react/forbid-prop-types]

See original GitHub issue

Hi I have this component:

import React from 'react';
import PropTypes from 'prop-types';
import { withStyles } from '@material-ui/core/styles';
import Paper from '@material-ui/core/Paper';
import Typography from '@material-ui/core/Typography';

const styles = theme => ({
  root: {
    ...theme.mixins.gutters(),
    paddingTop: theme.spacing.unit * 2,
    paddingBottom: theme.spacing.unit * 2,
  },
});

function PaperSheet(props) {
  const { classes } = props;
  const { title, data } = props;

  return (
    <div>
      <Paper className={classes.root} elevation={1}>
        <Typography variant="h5" component="h3">
          {title}
        </Typography>
        <Typography component="p">
          {data}
        </Typography>
      </Paper>
    </div>
  );
}

PaperSheet.propTypes = {
  classes: PropTypes.object.isRequired,
  title: PropTypes.string.isRequired,
  data: PropTypes.array.isRequired,
};

export default withStyles(styles)(PaperSheet);

package.json:

{
  "name": "app",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "start:dev": "webpack && webpack-dev-server"
  },
  "keywords": [],
  "author": "",
  "license": "ISC",
  "dependencies": {
    "@material-ui/core": "^3.6.1",
    "mathjs": "^5.3.1",
    "prop-types": "^15.6.2",
    "react": "^16.7.0-alpha.2",
    "react-dom": "^16.7.0-alpha.2"
  },
  "devDependencies": {
    "@babel/core": "^7.2.0",
    "@babel/preset-env": "^7.2.0",
    "@babel/preset-react": "^7.0.0",
    "babel-eslint": "^10.0.1",
    "babel-loader": "^8.0.4",
    "eslint": "^5.9.0",
    "eslint-config-airbnb": "^17.1.0",
    "eslint-plugin-import": "^2.14.0",
    "eslint-plugin-jsx-a11y": "^6.1.2",
    "eslint-plugin-react": "^7.11.1",
    "webpack": "^4.27.0",
    "webpack-cli": "^3.1.2",
    "webpack-dev-server": "^3.1.10"
  }
}

.eslint.rc

module.exports = {
    "extends": [
        "airbnb",
        "eslint:recommended",
        "plugin:react/recommended"
    ],
    "parser": "babel-eslint",
    "parserOptions": {
        "ecmaFeatures": {
          "jsx": true
        }
      }
};

I got eslint errors for the PropTypes object:

PaperSheet.propTypes = {
  classes: PropTypes.object.isRequired,
  title: PropTypes.string.isRequired,
  data: PropTypes.array.isRequired,
};

The error mentions: Prop type object is forbidden How can I fix that?

Issue Analytics

State:
Created 5 years ago
Reactions:12
Comments:28 (11 by maintainers)

Top GitHub Comments

161reactions

EzequielDeSimone-Reflektioncommented, Dec 14, 2018

You can define as following: dataOptions: PropTypes.objectOf(PropTypes.object()),

52reactions

chiragSuccessivecommented, Feb 27, 2019

You can define as following: dataOptions: PropTypes.objectOf(PropTypes.object()),

PropTypes.objectOf(PropTypes.object), PropTypes.object() is not callable.

Top Results From Across the Web

Prop type object if forbidden [react/forbid-prop-types] #2079

This ESLint rule is forbidding prop types of OBJECT because they are very unspecific. Just like our function will probably expect to use...

Route object validation as props in React - Stack Overflow

route: React.PropTypes.object - my eslint complains: Prop type object is forbidden react/forbid-prop-types · route: React.PropTypes.instanceOf(React.

Fix/enable ESLint react/forbid-prop-types - Bugzilla@Mozilla

Example failure shown by `yarn lint` after removing the rule-disabling from .eslintrc.js: error: Prop type `object` is forbidden (react/forbid-prop-types) ...

Common code mistakes in React that you (maybe) made

Next one is not informative propTypes. Don't use PropTypes.any, PropTypes.array and PropTypes.object. Describe your props as much as possible.

Don't Call PropTypes Warning - React

In a future major release of React, the code that implements PropType validation functions will be stripped in production. Once this happens, any...