By default this rule prevents passing of props that add lots of complexity (className
, style
) to Components. This rule only applies to Components (e.g. <Foo />
) and not DOM nodes (e.g. <div />
). The list of forbidden props can be customized with the forbid
option.
This rule checks all JSX elements and verifies that no forbidden props are used on Components. This rule is off by default.
The following patterns are considered warnings:
<Hello className='foo' />
<Hello style={{color: 'red'}} />
The following patterns are not considered warnings:
<Hello name='Joe' />
<div className='foo' />
<div style={{color: 'red'}} />
...
"react/forbid-component-props": [<enabled>, { "forbid": [<string>|<object>] }]
...
An array specifying the names of props that are forbidden. The default value of this option is ['className', 'style']
.
Each array element can either be a string with the property name or object specifying the property name and a component whitelist:
{
"propName": "someProp",
"allowedFor": [SomeComponent, AnotherComponent]
}