导出一份订单明细表或对账单时，页面设置往往决定了打印出来的成品是否易读：表格要不要连网格线和行号列标一起打出来、以多高的精度输出、批注跟不跟着走，这些选项分散在 Excel「页面设置」对话框的多个选项卡里，逐个点选费时费力。Spire.XLS for JavaScript 基于 WebAssembly 在浏览器端直接完成页面设置，通过虚拟文件系统（VFS）管理输入输出文件，无需后端服务支持。
本文主要介绍以下三个核心功能点：
有关安装和项目配置，请参考 React 项目中集成 Spire.XLS for JavaScript。以下示例默认已安装 Spire.XLS 并完成 WebAssembly 模块初始化。
设置打印质量与草稿质量
打印质量决定输出时每个点阵的墨滴数，取值是一个以 dpi 为单位的整数；草稿质量则让打印机以更省墨的方式快速输出，适合内部传阅的校样。Spire.XLS for JavaScript 通过 PageSetup 的 PrintQuality 与 Draft 属性设置这两项：
PrintQuality = 72把打印质量设为 72 dpi，取值偏低，出纸更快、耗材更省Draft = true开启草稿质量，打印速度优先于精细度 具体完整的示例代码如下：
function App() {
const setPrintQuality = async () => {
// 获取 Spire.XLS WASM 模块
const xlsModule = window.wasmModule?.spirexls;
// 检查模块是否就绪
if (!xlsModule) {
alert('Spire.Xls is not ready yet');
return;
}
// 将字体与输入文件载入 VFS
await window.spire.FetchFileToVFS('simsun.ttc', '/Library/Fonts/', `${process.env.PUBLIC_URL}/font/`);
const inputFileName = 'OrderDetails.xlsx';
await window.spire.FetchFileToVFS(inputFileName, '', `${process.env.PUBLIC_URL}data/`);
// 加载工作簿，取第一个工作表
const workbook = new xlsModule.Workbook();
workbook.LoadFromFile({ fileName: inputFileName });
const sheet = workbook.Worksheets.get(0);
// 取得工作表的页面设置
const pageSetup = sheet.PageSetup;
// 把打印质量设为 72 dpi
pageSetup.PrintQuality = 72;
// 开启草稿质量，打印速度优先于精细度
pageSetup.Draft = true;
// 保存工作簿
const outputFileName = 'SetPrintQuality.xlsx';
workbook.SaveToFile({ fileName: outputFileName, version: xlsModule.ExcelVersion.Version2010 });
// 释放 workbook 对象以释放资源
workbook.Dispose();
// 从 VFS 读取结果文件，触发下载
const fileArray = window.dotnetRuntime.Module.FS.readFile(outputFileName);
const blob = new Blob([fileArray], { type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet' });
const url = URL.createObjectURL(blob);
const a = document.createElement('a');
a.href = url;
a.download = outputFileName;
a.click();
URL.revokeObjectURL(url);
};
return (
<div style={{ textAlign: 'center', height: '300px' }}>
<h1>设置打印质量与草稿质量</h1>
<button onClick={setPrintQuality}>设置打印质量与草稿质量</button>
</div>
);
}
export default App;
原文件打印效果：
运行后，打印质量与草稿质量的效果：
打印网格线与行号列标
屏幕上的网格线不会跟着数据一起打印出来，如果表格本身没有设置边框，纸质件上就只剩一片浮空的数据，核对时很难定位单元格。行号列标同理。IsPrintGridlines 与 IsPrintHeadings 两个布尔属性分别控制这两项。具体完整的示例代码如下：
function App() {
const setGridlinesAndHeadings = async () => {
// 获取 Spire.XLS WASM 模块
const xlsModule = window.wasmModule?.spirexls;
// 检查模块是否就绪
if (!xlsModule) {
alert('Spire.Xls is not ready yet');
return;
}
// 将字体与输入文件载入 VFS
await window.spire.FetchFileToVFS('simsun.ttc', '/Library/Fonts/', `${process.env.PUBLIC_URL}/font/`);
const inputFileName = 'OrderDetails.xlsx';
await window.spire.FetchFileToVFS(inputFileName, '', `${process.env.PUBLIC_URL}data/`);
// 加载工作簿，取第一个工作表
const workbook = new xlsModule.Workbook();
workbook.LoadFromFile({ fileName: inputFileName });
const sheet = workbook.Worksheets.get(0);
// 取得工作表的页面设置
const pageSetup = sheet.PageSetup;
// 打印时输出网格线
pageSetup.IsPrintGridlines = true;
// 打印时输出行号与列标
pageSetup.IsPrintHeadings = true;
// 保存工作簿
const outputFileName = 'SetGridlinesAndHeadings.xlsx';
workbook.SaveToFile({ fileName: outputFileName, version: xlsModule.ExcelVersion.Version2010 });
// 释放 workbook 对象以释放资源
workbook.Dispose();
// 从 VFS 读取结果文件，触发下载
const fileArray = window.dotnetRuntime.Module.FS.readFile(outputFileName);
const blob = new Blob([fileArray], { type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet' });
const url = URL.createObjectURL(blob);
const a = document.createElement('a');
a.href = url;
a.download = outputFileName;
a.click();
URL.revokeObjectURL(url);
};
return (
<div style={{ textAlign: 'center', height: '300px' }}>
<h1>打印网格线与行号列标</h1>
<button onClick={setGridlinesAndHeadings}>打印网格线与行号列标</button>
</div>
);
}
export default App;
运行后，打印网格线与行号列标的效果：
设置黑白打印、批注与错误值打印
余下的三项输出开关同样落在 PageSetup 上，分别决定纸质件呈现什么颜色、批注是否随表打印、错误值如何显示。三项属性与取值如下：
BlackAndWhite设为true时以黑白模式打印，彩色内容转为灰度输出，只有黑白激光打印机时尤其适用PrintComments取InPlace时，批注框随其在工作表上的位置一起打印；批注需先设为显示状态，未显示的批注不参与打印PrintErrors取NA时，所有错误值（如#DIV/0!）在纸质件上统一显示为#N/A，内部公式错误对阅读者不可见
具体完整的示例代码如下：
function App() {
const setOtherPrintOptions = async () => {
// 获取 Spire.XLS WASM 模块
const xlsModule = window.wasmModule?.spirexls;
// 检查模块是否就绪
if (!xlsModule) {
alert('Spire.Xls is not ready yet');
return;
}
// 将字体与输入文件载入 VFS
await window.spire.FetchFileToVFS('simsun.ttc', '/Library/Fonts/', `${process.env.PUBLIC_URL}/font/`);
const inputFileName = 'OrderDetails.xlsx';
await window.spire.FetchFileToVFS(inputFileName, '', `${process.env.PUBLIC_URL}data/`);
// 加载工作簿，取第一个工作表
const workbook = new xlsModule.Workbook();
workbook.LoadFromFile({ fileName: inputFileName });
const sheet = workbook.Worksheets.get(0);
// 取得工作表的页面设置
const pageSetup = sheet.PageSetup;
// 样本在 A14 单元格上有一条批注
// 先把批注设为显示状态，未显示的批注不参与打印
sheet.Range.get('A14').Comment.Visible = true;
// 以黑白模式打印工作表
pageSetup.BlackAndWhite = true;
// 批注按其在工作表上的位置打印
pageSetup.PrintComments = xlsModule.PrintCommentType.InPlace;
// 单元格错误值统一打印成 #N/A
pageSetup.PrintErrors = xlsModule.PrintErrorsType.NA;
// 保存工作簿
const outputFileName = 'SetOtherPrintOptions.xlsx';
workbook.SaveToFile({ fileName: outputFileName, version: xlsModule.ExcelVersion.Version2010 });
// 释放 workbook 对象以释放资源
workbook.Dispose();
// 从 VFS 读取结果文件，触发下载
const fileArray = window.dotnetRuntime.Module.FS.readFile(outputFileName);
const blob = new Blob([fileArray], { type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet' });
const url = URL.createObjectURL(blob);
const a = document.createElement('a');
a.href = url;
a.download = outputFileName;
a.click();
URL.revokeObjectURL(url);
};
return (
<div style={{ textAlign: 'center', height: '300px' }}>
<h1>设置黑白打印、批注与错误值打印</h1>
<button onClick={setOtherPrintOptions}>设置黑白打印、批注与错误值打印</button>
</div>
);
}
export default App;
运行后，黑白打印、批注与错误值打印的效果：
常见问题
表格分了好几页，调低打印质量也没能打印在一页上
原因：打印质量与草稿质量只决定输出的精度与耗墨量，不改变内容的布局，因此再怎么调低，分页位置都不会移动。要把整张表收进一页，需要设置的是页面缩放，与打印质量无关；两者同时设置时并不冲突，只是各自管各自的事。
解决：用 FitToPagesWide 与 FitToPagesTall 把工作表压缩到指定页数，取 1 表示一页宽、一页高：
// 把工作表缩放打印到一页宽、一页高
pageSetup.FitToPagesWide = 1;
pageSetup.FitToPagesTall = 1;
设置了 PrintQuality 与 Draft，工作表看上去没有任何变化
原因：这两项都只作用于打印机输出，不改变工作表本身的内容与显示，因此设置完成后再看文档，页面不会有任何不同——这属于正常现象，并不代表设置没有生效。
获取免费许可证
如果您希望删除结果文档中的评估消息，或者摆脱功能限制，请该Email地址已收到反垃圾邮件插件保护。要显示它您需要在浏览器中启用JavaScript。获取有效期 30 天的临时许可证。
