1.问题:
目前有打印需求遇到了点问题,打印时表头太长导致出现横向滚动条,而借助于 react-to-print只能打印出视图区可见内容,所以打印的时候滚动条里面的内容没打印到。
现在为了完整打印页面内容,只能让表格列超过换行,这样才不会出现滚动条。
2.解决:
我们需要将列colums
数组项使用render
函数渲染,添加whiteSpace:'pre-wrap'
样式。
const columns = [{title: '序号', dataIndex: 'index', valueType: 'index', width: 48, fixed:'left'},{title: '客户', dataIndex: 'client', valueType: 'select', valueEnum: customerOptions, fieldProps:{showSearch: true }},{title: '发货', dataIndex: 'deliver', hideInSearch: true, width: 120},]columns.forEach((item,index)=>{if(index){item.render = (a,param)=>[<div style={{whiteSpace:'pre-wrap'}}>{param[item.dataIndex]}</div>]}})