Chiunque abbia formattato un lungo documento Word nel browser conosce il problema: il titolo di una sezione rimane orfano in fondo a una pagina mentre il suo testo inizia in quella successiva, oppure il contenuto incollato da un altro file si porta dietro una catena di pagine bianche indesiderate. Entrambi i problemi quasi sempre risalgono alle interruzioni di pagina: assenti dove dovrebbero esserci, o lasciate dove non dovrebbero esserci.
Spire.Doc for JavaScript funziona interamente nel browser tramite WebAssembly, utilizzando un file system virtuale (VFS) per gestire l'I/O dei file. Ciò significa che puoi inserire e rimuovere interruzioni di pagina senza alcun passaggio a un backend. Questa guida copre entrambe le operazioni e affronta due casi limite che emergono frequentemente con documenti reali:
- Inserire un'interruzione di pagina in un paragrafo specifico
- Rimuovere tutte le interruzioni di pagina in un'unica operazione
- Correggere la riga vuota extra che compare dopo l'inserimento di un'interruzione
- Correggere il documento che rimane paginato dopo la rimozione delle interruzioni
Per l'installazione e la configurazione del progetto, consulta Integrare Spire.Doc for JavaScript in un progetto React. Gli esempi seguenti presuppongono che il modulo WASM sia già inizializzato.
Inserire un'interruzione di pagina in un paragrafo specifico
Il flusso di lavoro si articola in tre passaggi: caricare il documento di destinazione nel file system virtuale WASM tramite FetchFileToVFS, aprirlo come oggetto Document, quindi individuare il paragrafo in cui si desidera che avvenga la divisione e chiamare AppendBreak con BreakType.PageBreak. L'interruzione viene aggiunta come oggetto figlio alla fine di quel paragrafo, quindi tutto ciò che segue scorre sulla pagina successiva. Infine, leggi il file salvato dal VFS, avvolgilo come Blob e attiva il download dal browser.
function App() {
const InsertPageBreak = async () => {
const docModule = window.wasmModule?.spiredoc;
if (!docModule) {
alert('Spire.Doc is not ready yet');
return;
}
// Load the target Word document into VFS
const inputFileName = "Template_Docx_1.docx";
await window.spire.FetchFileToVFS(inputFileName, "", `${process.env.PUBLIC_URL}static/data/`);
// Create a Document instance and load the document
const doc = new docModule.Document();
doc.LoadFromFile(inputFileName);
// Locate the fourth paragraph of the first section and append a page break to its end
doc.Sections.get_Item(0).Paragraphs.get_Item(3).AppendBreak(docModule.BreakType.PageBreak);
// Define the output file name
const outputFileName = "InsertPageBreak_out.docx";
// Save the document to VFS
doc.SaveToFile({ fileName: outputFileName, fileFormat: docModule.FileFormat.Docx2013 });
doc.Dispose();
const modifiedFileArray = window.dotnetRuntime.Module.FS.readFile(outputFileName);
const blob = new Blob([modifiedFileArray], { type: 'application/vnd.openxmlformats-officedocument.wordprocessingml.document' });
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>Insert a Page Break into a Word Document</h1>
<button onClick={InsertPageBreak}>Generate</button>
</div>
);
}
export default App;
Il documento dopo che un'interruzione di pagina è stata aggiunta alla fine del quarto paragrafo
Rimuovere tutte le interruzioni di pagina in un'unica operazione
Quando un documento accumula interruzioni di pagina a causa di modifiche ripetute o operazioni di copia-incolla, spesso è necessario eliminarle tutte e lasciare che il contenuto si ridisponi naturalmente. L'approccio: scorrere ogni paragrafo della sezione di destinazione e ispezionare ciascun oggetto figlio. Quando un figlio viene identificato come Break con BreakType.PageBreak, rimuovilo tramite ChildObjects.Remove.
Un dettaglio fondamentale nel ciclo interno: gli oggetti figli vengono percorsi all'indietro, dall'ultimo indice fino a zero. Rimuovere un elemento da una collezione percorsa in avanti sposta gli indici di ogni elemento successivo, il che può causare elementi saltati o accessi fuori dai limiti. Il percorso inverso evita completamente questo problema perché ogni rimozione influisce solo sugli indici già elaborati.
function App() {
const RemovePageBreaks = async () => {
const docModule = window.wasmModule?.spiredoc;
if (!docModule) {
alert('Spire.Doc is not ready yet');
return;
}
// Load the target Word document into VFS
const inputFileName = "Template_Docx_4.docx";
await window.spire.FetchFileToVFS(inputFileName, "", `${process.env.PUBLIC_URL}static/data/`);
// Create a Document instance and load the document
const doc = new docModule.Document();
doc.LoadFromFile(inputFileName);
// Get the first section
const section = doc.Sections.get_Item(0);
// Walk through every paragraph in the section
for (let j = 0; j < section.Paragraphs.Count; j++) {
const p = section.Paragraphs.get_Item(j);
// Walk the paragraph's child objects backwards, so that removing an element does not shift the indices still to come
for (let i = p.ChildObjects.Count - 1; i >= 0; i--) {
const obj = p.ChildObjects.get_Item(i);
// Test whether the object is a page break
if (obj.DocumentObjectType == docModule.DocumentObjectType.Break
&& obj.BreakType == docModule.BreakType.PageBreak) {
// Remove the page break from the paragraph
p.ChildObjects.Remove(obj);
}
}
}
// Define the output file name
const outputFileName = "RemovePageBreaks_out.docx";
// Save the document to VFS
doc.SaveToFile({ fileName: outputFileName, fileFormat: docModule.FileFormat.Docx2013 });
doc.Dispose();
const modifiedFileArray = window.dotnetRuntime.Module.FS.readFile(outputFileName);
const blob = new Blob([modifiedFileArray], { type: 'application/vnd.openxmlformats-officedocument.wordprocessingml.document' });
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>Remove Page Breaks from a Word Document</h1>
<button onClick={RemovePageBreaks}>Generate</button>
</div>
);
}
export default App;
Il documento dopo che ogni interruzione di pagina è stata rimossa
Riga vuota extra dopo l'inserimento di un'interruzione di pagina
Dopo aver chiamato AppendBreak, potresti notare una striscia vuota indesiderata nella parte superiore della nuova pagina. Ciò accade perché AppendBreak collega l'interruzione alla fine del paragrafo di destinazione, e l'impostazione di "spazio dopo" di quel paragrafo si trasferisce all'inizio della pagina successiva. Quando la spaziatura automatica è attiva, lo spazio si adatta persino alla dimensione del carattere, rendendolo particolarmente visibile dopo titoli di grandi dimensioni.
La soluzione consiste nel neutralizzare la spaziatura finale del paragrafo prima di aggiungere l'interruzione:
const para = document.Sections.get_Item(0).Paragraphs.get_Item(3);
// Turn off automatic spacing after the paragraph and set the space after it to 0
para.Format.AfterAutoSpacing = false;
para.Format.AfterSpacing = 0;
// Then insert the page break
para.AppendBreak(wasmModule.BreakType.PageBreak);
Impostare AfterAutoSpacing su false e AfterSpacing su 0 assicura che il paragrafo non contribuisca con alcuno spazio verticale dopo l'interruzione, così la nuova pagina inizia a filo del margine superiore.
Il documento rimane paginato dopo la rimozione delle interruzioni
Anche dopo aver eliminato con successo ogni oggetto interruzione di pagina, il documento potrebbe ancora dividersi nelle stesse posizioni. Il motivo: la paginazione può derivare anche da una proprietà a livello di paragrafo chiamata "interruzione di pagina prima". Quando questo flag è impostato su un paragrafo, quel paragrafo inizia sempre su una nuova pagina, indipendentemente dall'esistenza di un oggetto Break. Il ciclo di rimozione precedente prende di mira solo gli oggetti interruzione, quindi i paragrafi che portano questo flag rimangono invariati.
Per eliminare completamente la paginazione forzata, reimposta il flag PageBreakBefore su ogni paragrafo insieme alla pulizia degli oggetti interruzione:
const section = document.Sections.get_Item(0);
for (let j = 0; j < section.Paragraphs.Count; j++) {
const p = section.Paragraphs.get_Item(j);
// Clear the page-break-before property set on the paragraph
if (p.Format.PageBreakBefore) {
p.Format.PageBreakBefore = false;
}
}
Puoi eseguire questo ciclo nella stessa passata della rimozione degli oggetti interruzione oppure come passaggio separato successivo: l'ordine non ha importanza perché le due operazioni agiscono su proprietà indipendenti.
Domande frequenti
Come posso ottenere una licenza gratuita per Spire.Doc for JavaScript?
Spire.Doc for JavaScript offre una licenza di prova gratuita di 30 giorni con tutte le funzionalità e senza limitazioni funzionali. Puoi richiederla qui per valutare il prodotto prima dell'acquisto.