Question

为什么我会收到此警告？

警告没有重复的道具允许反应/ jsx-no-duplicate-props＃

它显示第28行，但没有任何道具正在使用。

Answer 1

您可能会将同一道具两次传递给组件。 e.g。

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

Answer 2

我也遇到了这个错误，我正在渲染一个组件并两次传递了'className'。我的解决方案在How to apply multiple classnames to an element处找到。然后我只是将名称混在一起，错误消失了，我的UI呈现得很完美。

//错误

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

//解决方案

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

Answer 3

关于 Material-UI TextField 的大写/小写问题，一个需要 inputProps 和 InputProps 的组件，我不希望 ESLint 为此输出警告，所以我添加了这到我的 .eslintrc.json 文件：

"rules": {
    "react/jsx-no-duplicate-props": [1, { "ignoreCase": false }]
  }

Answer 4

它可以很简单，就像HTML上的重复ID：

https://cloud.google.com/deployment-manager/docs/configuration/supported-resource-types

Answer 5

当在同一标签上使用任何重复属性时，就会发出警告。

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

为什么我得到这个警告`没有重复道具允许反应/ jsx-no-duplicate-props`

5 个答案: