DocumentationRulesno-children-to-array

no-children-to-array

Full Name in eslint-plugin-react-x

react-x/no-children-to-array

Full Name in @eslint-react/eslint-plugin

@eslint-react/no-children-to-array

Features

🔍

Presets

  • core
  • recommended
  • recommended-typescript
  • recommended-type-checked

What it does

Prevents the use of Children.toArray from the react package.

Why is this bad?

Using Children.toArray is uncommon and can lead to fragile code. See common alternatives.

Examples

Failing

import React, { Children } from "react";
 
interface ExampleProps {
  children: React.ReactNode;
}
 
function Example({ children }: ExampleProps) {
  const result = Children.toArray(children);
  result.reverse();
  // ...
}

Further Reading