# react/jsx-no-duplicate-props

> Disallow the same prop twice on one JSX element

When a prop is written twice, the last one wins and the first is silently dropped. That's nearly always a leftover from an edit or a merge.

{/* Generated by src/codegen/lint-rule-docs.ts. Do not edit this section. */}

## Configure

Off by default. To turn it on:

```toml bunfig.toml
[lint.rules]
"react/jsx-no-duplicate-props" = "error" # or "warn"
```

Every option, set to its default:

```toml bunfig.toml
[lint.rules]
"react/jsx-no-duplicate-props" = ["error", {
  ignoreCase = false,
}]
```

{/* End of the generated section. */}

## Examples

Reported:

{/* bad */}
```jsx
const field = <Input name="email" type="text" name="username" />;
```

Not reported:

{/* good */}
```jsx
const field = <Input name="email" type="text" />;
```

## Options

| Option | Default | What it does |
| --- | --- | --- |
| `ignoreCase` | `false` | Treat names that differ only in case, such as `onClick` and `onclick`, as the same prop. |

{/* bad {"options": [{"ignoreCase": true}]} */}
```jsx
const button = <Button onClick={save} onclick={save} />;
```