6 ms·
Is this better for your eyes? React.createElement( "div", null, React.createElement( "div", null, React.createEleme
by arcosdev 8y ago
Is this better for your eyes?
React.createElement(
"div",
null,
React.createElement(
"div",
null,
React.createElement(
"p",
null,
React.createElement(
"a",
{ href: "foo" },
"Link"
)
)
)
);
document.getElementById('root')
);
- mhink 8y agofwiw, I have no problem with JSX, but the React documentation itself [1] suggests using react-hyperscript, which (along with hyperscript-helpers) makes a very nice syntax: div([ div([ p([ a({ href: "foo" }, "Link") ]) ]) ]) [1] https://reactjs.org/docs/react-without-jsx.html https://reactjs.org/docs/react-without-jsx.html
- mateuszf 8y agoNah, still lot uglier than jsx IMO.
- jhall1468 8y agoThey do not "suggest" using react-hyperscript, it says if you don't want to Babelify your code you can use it. I suppose that's a nice syntax if you really love Lisp, but I sure don't.
- Shorn 8y agoI had previously shied away from React when I had seen it before because I thought it was another templates-in-code approach. I was actually looking for some kind of Javacript equivalent to ScalaTags[1] that I could use in Typescript when I found out how well React and Typescript worked together. I guess react-hyperscript is what I was looking for, but I've grown to quite like JSX. [1] https://github.com/lihaoyi/scalatags https://github.com/lihaoyi/scalatags
- Raphael 8y agoimport {createElement as h} from 'react' import {render} from 'react-dom' render( h('div', null, h('div', null, h('p', null, h('a', {href:'foo'}, 'Link', ), ), ), ), document.getElementById('root') )