0

由于需求上需要加上打印功能,就是调出打印机的弹窗界面,刚好表格用的是antd表格,发现不管我把printTable的id放在哪个节点上都不会让表格对齐

以下代码调出打印功能界面

var tableToPrint = document.getElementById('printTable');//将要被打印的表格
var newWin= window.open("");//新打开一个空窗口
newWin.document.write(tableToPrint.outerHTML);//将表格添加进新的窗口
newWin.document.close();//在IE浏览器中使用必须添加这一句
newWin.focus();//在IE浏览器中使用必须添加这一句
newWin.print();//打印
newWin.close();//关闭窗口

下图是antd官网里面的Table其中一个Demo

https://codesandbox.io/s/jn3yj82nm3

图片描述

图片描述

2018-09-19 提问
2 个回答
0

已采纳

用了下面这种方法挺不错

import {Link} from 'react-router';

render() {
return (
...
<Link to="/printPage" target="_blank">打印</Link>
)
}

0

你只是把html放到新的窗口了,css又没有

注意这一句:

newWin.document.write(tableToPrint.outerHTML);//将表格添加进新的窗口

你为啥不把style也write进去呢?

撰写答案

你可能感兴趣的

推广链接