使用print-js直接打印动态表格数据
1、安装print-js
npm install print-js --save
2、在需要的页面上引入
import printJS from 'print-js'
3、打印按钮添加方法
<a-button type="primary" @click="printData()"><a-icon type="printer" />打印</a-button>
4、方法
printData(){
printJS({
printable: this.data,
properties: [
{ field: 'name', displayName: '学生' }, // field 要对应this.data里的字段
{ field: 'age', displayName: '年龄' },
{ field: 'grade.chinese', displayName: '语文' },
{ field: 'grade.engilsh', displayName: '英语' },
{ field: 'grade.math', displayName: '数学' },
],
type: 'json',
gridHeaderStyle: 'border: 1px solid #000;text-align:center',
gridStyle: 'border: 1px solid #000;text-align:center'
})
},
完成!
this.data的数据结构是这样的,grade是一个对象:
this.data = [
{
name:'张三',
age:'18',
grade:{ math:'100', chinese:'90', engilsh:'99' }
}
]