facebook / jsx

The JSX specification is a XML-like syntax extension to ECMAScript.
http://facebook.github.io/jsx/
1.95k stars 133 forks source link

Proposal: Attributes with the same name as their value #148

Closed platonlukyanov closed 2 years ago

platonlukyanov commented 2 years ago

Hi, this problem was searched on stackoverflow already. To me, code presented in stackoverflow answers look quite ugly.

We had a similar syntax inconvenience in JavaScript language and must have used syntax like this:

return {
    name: name,
    text: text,
    content: content,
}

When the ES6 came we got the modern syntax and opportunity to make our code neater.

return {
    name,
    text,
    content,
}

Problem Still in JSX this problem is actual. For example, we have a bunch of variables from props, inner variables and state. They all have the same name with props of childrean components. But passing these props looks gigantic.

function ArticleDetails({ text, color }) {
    const [draft, setDraft] = useState(false);
    const today = new Date.now();
    return (
        <div>
               <ArticleHeader color={color} />
               <ArticleContent  draft={draft} today={today} text={text}/>
       </div>
    )
}

Suggestion Implement prop, syntax

...
<div>
       <ArticleHeader color, />
       <ArticleContent  draft, today, text,/>
</div>
NekR commented 2 years ago

What you're suggesting is a boolean value already.

There is a better proposal already: https://github.com/facebook/jsx/issues/23