CODEWITHSUNDEEP
javascriptreactjs
Jheems
Jheems

Reputation: 358

ReactJS Rendering a component using a function call

So I am trying to create a component that I can use anywhere in my app. I am not entirely sure how to explain it accurately but I'll use the sweet alert library as an example.

So in swal, you can simply call something like this and the component would render itself.

import swal from 'sweetalert';

swal("Hello world!");

How can I replicate that into my own component so I could call it like

ConfirmationDialog({
     message: 'test',
     visibility: true,
     onConfirm: handleOnConfirm,
     onCancel: handleOnCancel
})

Upvotes: 1

Views: 77

Answers (1)

arellak
arellak

Reputation: 112

It's basically in one of the first points in the react documentation.
State and Lifecycle
At least if I understood your question correctly.

First example on the above website:

const root = ReactDOM.createRoot(document.getElementById('root'));
  
function tick() {
  const element = (
    <div>
      <h1>Hello, world!</h1>
      <h2>It is {new Date().toLocaleTimeString()}.</h2>
    </div>
  );
  root.render(element);
}

setInterval(tick, 1000);

Upvotes: 1

Related Questions