Why am I getting this warning `No duplicate props allowed react/jsx-no-duplicate-props`

问题

Why am I getting this warning?

warning No duplicate props allowed react/jsx-no-duplicate-props#

It's showing line number 28 but there is nothing props is using.

回答1:

You probably passed the same prop twice to a Component. e.g.

<MyComponent someProp={'a'} someProp={'b'} />

回答2:

I also go this error, I was rendering a component and passed 'className' twice. My solution was found here with How to apply multiple classnames to an element. I then just concated the names together, the error went away and my UI rendered perfectly.

//Error

<IconButton
  color="secondary"
  className={classes.button}
  className={classes.test}
  component="span"
  classes={{
    root: classes.checkRoot,
  }}
>

//Solution

<IconButton
 color="secondary"
 className={[classes.button, classes.test ]}
 component="span"
 classes={{
    root: classes.checkRoot,
 }}
>

回答3:

It can be as simple as duplicate id on HTML:

<input id="txt-id" id="txtID" />

回答4:

The warning come when any duplicate attribute is used on same tag i.e.

    <input id="a" id="b" />
    <MyComponent someProp={'a'} someProp={'b'} />
    <input placehoder="a" placeholder="a" />
    <div className='a' className='b'></div>

来源：https://stackoverflow.com/questions/42367236/why-am-i-getting-this-warning-no-duplicate-props-allowed-react-jsx-no-duplicate