Can I print a form or a tabular data in react js?

Question

Is there a way to send a print command to my printer for printing a tabular data in react js. Sorry if the question sounds silly because I am new to this. Thanks in advance.

Answer 1

Call window.print() function.

print(){
  window.print();
}

call this function when you want to print your current screen or component

Answer 2

Triggering the browser's native print behavior is quite simple: just call a window.print() in your code.

Then your page will be printed as it is, so commonly you should provide a CSS spefic for the print media. You have two way:

• add a separate CSS like <link rel="stylesheet" href="css/style.css"/>
• include a @media print in your existing CSS:

@media print { … }

What you should put inside your CSS? Whatever you need to fix your styles, commonly a lot of display: none rules to hide elements you don't want to print.

Final thoughts:

• print from HTML is not much cross-browser: some browsers print better than other
• printing HTML tables is full of caveats, for example take a look at: Repeat table headers in print mode