React API design questions – from a beginner



This content originally appeared on DEV Community and was authored by Yuxuan Zhang

Hi,

I do not have any experience on react/jsx, but I was involved in many other Node.js and frontend projects.

When going through the react.dev tutorials, I cannot help asking the following questions. I consulted ChatGPT before posting, but I was not satisfied by its answers.

1. Is it really necessary to rename attribute class to className?

A common argument for that is class being a reserved keyword in JS. However, it’s perfectly fine to pass it as a dict key.

Also, break-assignment can be renamed when catching class attribute in function arguments:

function Component({ class: className }) { ... }

Is there any other fundamental issue blocking the use of class as an attribute? Can we accept both class and className attributes in base DOM elements in a future version of react?

2. Why mixing children with other props?

// Instead of
function Component({ children, ...props }) { ... }

// Why not
function Component({ ...props }, ...children) { ... }

I just feel sad knowing that children works different as other keys in the same level…

I know there probably exist a ton of discussions on these topics, please feel free to shoot me links in case you know where to find them.


This content originally appeared on DEV Community and was authored by Yuxuan Zhang