Search code examples
javascriptreactjshtml2canvas

how to convert virtual DOM to an real DOM Element without render?

I use html2canvas to take a screen shot of my page.however html2canvas need an element as a param, but I have a react app and I use a template to get the virtual DOMs.the template need to be reused many times

（so I don't want to render them then get the Element by ref or getDocumentbyId(), that will be aweful）.

for instance: I got 1000 order data.and the templates will be 1000.then the virtual DOM object will be 1000.

Is there any way I can directly convert the virtual DOM Obj to an Element obj?

Solution 
  • import { renderToString } from 'react-dom/server'

renderToString(<YouComponent>)