Rules
no-children-for-each
Full Name in eslint-plugin-react-x
react-x/no-children-for-each
Full Name in @eslint-react/eslint-plugin
@eslint-react/no-children-for-each
Presets
x
recommended
recommended-typescript
recommended-type-checked
Description
Disallow the use of Children.forEach
from the react
package.
Using Children
is uncommon and can lead to fragile code. See common alternatives.
Examples
Failing
import React, { Children } from "react";
interface MyComponentProps {
children: React.ReactNode;
}
function MyComponent({ children }: MyComponentProps) {
const result = [];
Children.forEach(children, (child, index) => {
result.push(child);
result.push(<hr key={index} />);
});
// ...
}
Implementation
Further Reading
See Also
no-children-count
Prevents the use ofChildren.count
from thereact
package.no-children-map
Prevents the use ofChildren.map
from thereact
package.no-children-only
Prevents the use ofChildren.only
from thereact
package.no-children-to-array
Prevents the use ofChildren.toArray
from thereact
package.