How does vue element print the contents of the pop-up window?

use the dialog component in vue-element to display a form in the pop-up window , and use a print button to print the form.
Printing uses the window.print () method.
because only the part of the pop-up window in the page is printed, the div whose id is dialogContent replaces the innerHTML, of the original body and then the original body, code is printed as follows:

var oldHtml = document.body.innerHTML;
document.body.innerHTML = document.getElementById("dialogContent").innerHTML;
window.print();
document.body.innerHTML = oldHtml;
This method on the

network encounters two problems :
1. It can open the print interface for the first time, but after it is closed, it cannot be opened for the second time, and the page cannot do anything.
2, and because of the width of the form, the content of the form, the right half of which is not displayed in the print interface.

could you tell me how to solve it?


innerHMTL will cause binding loss, you can window.open (''), write document.write (dialogdome) to open a new page to print, is the experience.
or try to hide other elements


how to solve it later? At present, I am also printing incomplete


landlord, how to solve it in the end?

Menu