命名区域建立之后并非一劳永逸。随着数据表结构调整，原有的名称可能不再贴切，引用范围也可能因数据增减而失效；有些命名区域只是公式的中间辅助，并不需要出现在名称管理器中；而长期不再使用的命名区域如果一直保留，又会让名称列表变得冗长难查。因此，修改、隐藏与删除同样是命名区域使用过程中不可或缺的环节。Spire.XLS for JavaScript 提供了完整的命名区域管理 API，可在浏览器端通过 WebAssembly 完成上述操作，无需后端服务。
本文介绍三个核心功能点：
有关安装和项目配置，请参考 React 项目中集成 Spire.XLS for JavaScript。以下示例默认已安装 Spire.XLS 并完成 WebAssembly 模块初始化。
修改命名区域
修改包含两个相互独立的方面：名称本身与引用区域。名称通过 Name 属性重新赋值，引用区域通过 RefersToRange 属性重新指定，两者可以分别修改，也可以像下面的示例一样同时修改。具体操作步骤如下：
- 加载工作簿，获取第一个工作表。
- 通过
workbook.NameRanges.get(0)取出要修改的命名区域。 - 将
Name设为新的名称。 - 将
RefersToRange指向新的单元格区域。 - 保存工作簿。
下面是一个完整的代码示例，展示了在 React 中修改命名区域：
function App() {
const modifyNamedRange = 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/`);
// 将 Excel 文件载入 VFS
const inputFileName = 'AllNamedRanges.xlsx';
await window.spire.FetchFileToVFS(inputFileName, '', `${process.env.PUBLIC_URL}/static/data/`);
// 加载工作簿
const workbook = new xlsModule.Workbook();
workbook.LoadFromFile(inputFileName);
// 获取第一个工作表
let sheet = workbook.Worksheets.get(0);
// 修改命名区域的名称
workbook.NameRanges.get(0).Name = "RegionData";
// 修改命名区域引用的单元格区域
workbook.NameRanges.get(0).RefersToRange = sheet.Range.get("B2:C4");
// 保存工作簿
const outputFileName = 'ModifyNamedRange.xlsx';
workbook.SaveToFile(outputFileName);
// 释放资源
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={modifyNamedRange}>Start</button>
</div>
);
}
export default App;
运行后，修改命名区域的效果：
隐藏命名区域
把 Visible 属性设为 false，命名区域即被隐藏。隐藏后的命名区域依然保存在工作簿中，公式中引用它也不受影响，只是不再出现在 Excel 的名称管理器与名称框里，从而让名称列表保持整洁。下面的示例在隐藏之后，又于 F2 单元格写入了引用该命名区域的公式 =SUM(NameRange1)：公式照常算出结果，正说明命名区域只是不显示，并未被删除。具体操作步骤如下：
- 加载工作簿，获取第一个工作表。
- 取出要隐藏的命名区域。
- 将
Visible设为false。 - 在单元格中写入引用该命名区域的公式，验证隐藏后依然可用。
- 保存工作簿。
下面是一个完整的代码示例，展示了在 React 中隐藏命名区域：
function App() {
const hideNamedRange = 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/`);
// 将 Excel 文件载入 VFS
const inputFileName = 'AllNamedRanges.xlsx';
await window.spire.FetchFileToVFS(inputFileName, '', `${process.env.PUBLIC_URL}/static/data/`);
// 加载工作簿
const workbook = new xlsModule.Workbook();
workbook.LoadFromFile(inputFileName);
// 获取第一个工作表
let sheet = workbook.Worksheets.get(0);
// 隐藏第一个命名区域
workbook.NameRanges.get(0).Visible = false;
// 在单元格中写入引用该命名区域的公式，验证隐藏后它依然存在且可用
sheet.Range.get("F1").Text = "隐藏后求和";
sheet.Range.get("F2").Formula = "=SUM(NameRange1)";
// 计算公式，使保存后的文件打开即可看到结果
workbook.CalculateAllValue();
// 保存工作簿
const outputFileName = 'HideNamedRange.xlsx';
workbook.SaveToFile(outputFileName);
// 释放资源
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={hideNamedRange}>Start</button>
</div>
);
}
export default App;
运行后，隐藏命名区域的效果：
说明：F2 单元格的公式引用的是已被隐藏的 NameRange1，结果照常算出 120，说明隐藏只是让它不再显示，命名区域本身依然存在于工作簿中。
删除命名区域
删除命名区域有两种方式：已知名称时调用 Remove()，已知位置时调用 RemoveAt()。两者都会把命名区域从工作簿中彻底移除。具体操作步骤如下：
- 加载工作簿。
- 调用
Remove()按名称删除指定命名区域。 - 调用
RemoveAt()按索引删除指定命名区域。 - 保存工作簿。
下面是一个完整的代码示例，展示了在 React 中删除命名区域：
function App() {
const deleteNamedRange = 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/`);
// 将 Excel 文件载入 VFS
const inputFileName = 'AllNamedRanges.xlsx';
await window.spire.FetchFileToVFS(inputFileName, '', `${process.env.PUBLIC_URL}/static/data/`);
// 加载工作簿
const workbook = new xlsModule.Workbook();
workbook.LoadFromFile(inputFileName);
// 按名称删除命名区域
workbook.NameRanges.Remove("NameRange2");
// 按索引删除命名区域
workbook.NameRanges.RemoveAt(0);
// 保存工作簿
const outputFileName = 'DeleteNamedRange.xlsx';
workbook.SaveToFile(outputFileName);
// 释放资源
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={deleteNamedRange}>Start</button>
</div>
);
}
export default App;
运行后，删除命名区域的效果：
常见问题
公式写入单元格后，保存的文件打开为什么看不到结果？
原因：只给单元格设置 Formula 属性，Spire 不会顺带计算公式，保存出来的文件里只有公式本身，没有算好的结果值，Excel 打开后这一格就是空白。
解决：保存之前调用 workbook.CalculateAllValue()，先把公式计算一遍：
// 计算全部公式，结果值才会一并写入保存的文件
workbook.CalculateAllValue();
删除命名区域时可以直接传入命名区域对象吗？
原因：Remove() 的参数是名称字符串，传入 NameRange 对象类型不匹配，会抛出 Assert failed: Value is not a String，删除不会执行。
解决：已知名称时传名称字符串，已知位置时传索引：
// 按名称删除
workbook.NameRanges.Remove("NameRange2");
// 按索引删除
workbook.NameRanges.RemoveAt(0);
获取免费许可证
如果您希望删除结果文档中的评估消息，或者摆脱功能限制，请该Email地址已收到反垃圾邮件插件保护。要显示它您需要在浏览器中启用JavaScript。获取有效期 30 天的临时许可证。
