Properly pass an element to React for Rendering

Viewed 29

I have the following code to create and render a React element without using JSX:

function Weekday(props) {
    return React.createElement('p', null, `Today is ${props.day}`);
}

let dayElem = React.createElement(Weekday, {day: 'Monday'});

ReactDOM.createRoot(document.getElementById('app')).render(dayElem);

This is based on a tutorial that I am following. As you can see, createElement() is being called twice above. I thought it was weird and decided to define dayElem like this:

let dayElem = Weekday({day: 'Monday'});

It still works and renders the content properly. Is there a particular reason why the tutorial did it the first way, instead of simply calling the function?

Are there any disadvantages of using the second method?

Thanks.

0 Answers
Related