diff --git a/crates/oxc_linter/src/rules/react/no_array_index_key.rs b/crates/oxc_linter/src/rules/react/no_array_index_key.rs index cce48dec7d9c6..32200010fe0e6 100644 --- a/crates/oxc_linter/src/rules/react/no_array_index_key.rs +++ b/crates/oxc_linter/src/rules/react/no_array_index_key.rs @@ -112,7 +112,7 @@ fn check_react_clone_element<'a>( if key_ident.name.as_str() == "key" && span_contains_symbol_reference(ctx, index_param_symbol_id, prop.value.span()) { - ctx.diagnostic(no_array_index_key_diagnostic(obj_expr.span)); + ctx.diagnostic(no_array_index_key_diagnostic(prop.span)); } } } @@ -270,6 +270,12 @@ fn test() { React.cloneElement(thing, { key: index }) )); ", + r"things.map((thing, index) => ( + React.cloneElement(thing, { + key: index + }) + )); + ", r"things.map((thing, index) => ( React.cloneElement(thing, { key: `abc${index}` }) )); diff --git a/crates/oxc_linter/src/snapshots/react_no_array_index_key.snap b/crates/oxc_linter/src/snapshots/react_no_array_index_key.snap index 17e2f0e9ed396..0a2df99b184ba 100644 --- a/crates/oxc_linter/src/snapshots/react_no_array_index_key.snap +++ b/crates/oxc_linter/src/snapshots/react_no_array_index_key.snap @@ -39,28 +39,37 @@ source: crates/oxc_linter/src/tester.rs help: Use a unique data-dependent key to avoid unnecessary rerenders ⚠ eslint-plugin-react(no-array-index-key): Usage of Array index in keys is not allowed - ╭─[no_array_index_key.tsx:2:39] + ╭─[no_array_index_key.tsx:2:41] 1 │ things.map((thing, index) => ( 2 │ React.cloneElement(thing, { key: index }) - · ────────────── + · ────────── 3 │ )); ╰──── help: Use a unique data-dependent key to avoid unnecessary rerenders ⚠ eslint-plugin-react(no-array-index-key): Usage of Array index in keys is not allowed - ╭─[no_array_index_key.tsx:2:39] + ╭─[no_array_index_key.tsx:3:15] + 2 │ React.cloneElement(thing, { + 3 │ key: index + · ────────── + 4 │ }) + ╰──── + help: Use a unique data-dependent key to avoid unnecessary rerenders + + ⚠ eslint-plugin-react(no-array-index-key): Usage of Array index in keys is not allowed + ╭─[no_array_index_key.tsx:2:41] 1 │ things.map((thing, index) => ( 2 │ React.cloneElement(thing, { key: `abc${index}` }) - · ────────────────────── + · ────────────────── 3 │ )); ╰──── help: Use a unique data-dependent key to avoid unnecessary rerenders ⚠ eslint-plugin-react(no-array-index-key): Usage of Array index in keys is not allowed - ╭─[no_array_index_key.tsx:2:39] + ╭─[no_array_index_key.tsx:2:41] 1 │ things.map((thing, index) => ( 2 │ React.cloneElement(thing, { key: 1 + index }) - · ────────────────── + · ────────────── 3 │ )); ╰──── help: Use a unique data-dependent key to avoid unnecessary rerenders