CODEWITHSUNDEEP
reactjs
Nika Roffy
Nika Roffy

Reputation: 941

propType [name] is not required, but has no corresponding defaultProps declaration ReactJS

import styled from 'styled-components'
import propTypes from 'prop-types'
import React from 'react'

const Checkbox = ({ className, checked, ...props }) => (
  <CheckboxContainer className={className}>
    <HiddenCheckbox checked={checked} {...props} />
    <StyledCheckbox checked={checked}>
      <Icon viewBox="0 0 24 24">
        <polyline points="20 6 9 17 4 12" />
      </Icon>
    </StyledCheckbox>
  </CheckboxContainer>
)
    
Checkbox.propTypes = {
  checked: propTypes.boolean,
  className: propTypes.string,
}

I have this component and I'm always getting this error: error propType "className" is not required, but has no corresponding defaultProps declaration react/require-default-props

I don't know how to fix it any suggestions, please?

Upvotes: 40

Views: 53044

Answers (2)

Ismoil Shokirov
Ismoil Shokirov

Reputation: 3011

If you want to disable this type of warning, just update your rules inside .eslintrc.json

"rules": {
  "react/require-default-props": "off"
}

Alternatively, you can mark it as a warning

"rules": {
  "react/require-default-props": "warn"
}

Upvotes: 5

keul
keul

Reputation: 7819

It's explained in the documentation: https://reactjs.org/docs/typechecking-with-proptypes.html#default-prop-values

As you are marking this prop as not required it is asking you to put a default in case the prop is missing.

So, something like this (but default values depends on you):

Checkbox.defaultProps = {
  checked: false,
  className: null,
}

Upvotes: 51

Related Questions