prefer-destructuring-assignment
Rule category
Style.
What it does
Enforces the use of destructuring assignment over property assignment.
Examples
This rule aims to enforce the use of destructuring assignment over property assignment.
Failing
import React from "react";
interface ExampleProps {
items: string[];
}
function Example(props: ExampleProps) {
const items = props.items;
// ^^^^^^^^^^^
// - Prefer destructuring assignment.
return <div>{items}</div>;
}
import React from "react";
interface ExampleProps {
items: string[];
}
function Example(props: ExampleProps) {
return <div>{props.items}</div>;
// ^^^^^^^^^^^
// - Prefer destructuring assignment.
}
Passing
import React from "react";
interface ExampleProps {
items: string[];
}
function Example(props: ExampleProps) {
const { items } = props;
return <div>{items}</div>;
}
import React from "react";
interface ExampleProps {
items: string[];
}
function Example({ items }: ExampleProps) {
return <div>{items}</div>;
}
import React from "react";
interface ExampleProps {
items: string[];
}
function Example({ items, ...rest }: ExampleProps) {
return <div {...rest}>{items}</div>;
}