If the default document import behavior of Univer does not meet your needs, you can customize the import behavior using the Facade API.
Most of the time, you may want to hide the import entry provided by the plugin or directly display the successfully imported file in the current instance. Here are some code examples for reference.
Hide Import Entry
Preset Mode
UniverSheetsCorePreset({ menu: { 'sheets-exchange-client.operation.exchange': { hidden: true, }, },})Plugin Mode
univer.registerPlugin(UniverSheetsUIPlugin, { menu: { 'sheets-exchange-client.operation.exchange': { hidden: true, }, },})Preset Mode
UniverDocsCorePreset({ menu: { 'docs-exchange-client.operation.exchange': { hidden: true, }, },})Plugin Mode
univer.registerPlugin(UniverDocsUIPlugin, { menu: { 'docs-exchange-client.operation.exchange': { hidden: true, }, },})Custom Slides PPTX Import
Univer Slides does not provide preset mode. To hide the PPTX import/export menu in plugin mode, pass a menu config to UniverSlidesExchangeClientPlugin:
univer.registerPlugin(UniverSlidesExchangeClientPlugin, { menu: { 'slides-exchange-client.operation.exchange': { hidden: true, }, },})To import a .pptx file from a URL, obtain a File object first:
const url = 'https://example.com/filename.pptx' // Your PowerPoint file URLasync function fetchPPTXFile(url) { try { const response = await fetch(url) const blob = await response.blob() return new File([blob], 'filename.pptx', { type: 'application/vnd.openxmlformats-officedocument.presentationml.presentation', }) } catch (error) { console.error('Failed to fetch the file:', error) }}const file = await fetchPPTXFile(url)If you use a Pro server-side unit workflow, import the PPTX file and load the created Slides unit:
import { UniverInstanceType } from '@univerjs/core'const unitId = await univerAPI.importSlideToUnitIdAsync(file)if (unitId) { univerAPI.loadServerUnit(unitId, UniverInstanceType.UNIVER_SLIDE)}If you only need local rendering, import it as slide data and create a presentation:
const slideData = await univerAPI.importSlideToSnapshotAsync(file)if (slideData) { univerAPI.createPresentation(slideData)}Import Document from URL
You first need to obtain a File object, which you can usually get through file upload or by fetching from a URL. Here is an example code snippet that fetches a .xlsx file from a URL and converts it into a File object.
const url = 'https://example.com/filename.xlsx' // Your Excel file URL// Function to fetch and convert the URL to a File object.// Here, the fetch API is used to directly obtain the file,// which may need to be modified according to the actual situation,// such as file address authentication and cross-domain issues.async function fetchExcelFile(url) { try { const response = await fetch(url) const blob = await response.blob() return new File([blob], 'filename.xlsx', { type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet' }) } catch (error) { console.error('Failed to fetch the file:', error) }}// Fetch the file and import it as a snapshot// If the URL file address is not authenticated,// you can directly pass it to the importSheetToSnapshotAsync or importSheetToUnitIdAsync methodconst file = await fetchExcelFile(url)If you are using collaborative editing features, you can use the univerAPI.importSheetToUnitIdAsync method to import the .xlsx file and obtain a unitId, then load the workbook using the univerAPI.loadServerUnit method.
import { UniverInstanceType } from '@univerjs/core'// When using presets, you can import `UniverInstanceType` from `@univerjs/presets`import { UniverInstanceType } from '@univerjs/presets'univerAPI.importSheetToUnitIdAsync(file).then((unitId) => { console.log('Unit ID created:', unitId) univerAPI.loadServerUnit(unitId, UniverInstanceType.UNIVER_SHEET)})Or if you just want to import the .xlsx file as a snapshot (IWorkbookData) and render it in the current instance, you can use the univerAPI.importSheetToSnapshotAsync method.
// Modify the following code according to the actual situationuniverAPI.importSheetToSnapshotAsync(file).then((snapshot) => { console.log('Snapshot created:', snapshot) // Create a new workbook with the snapshot univerAPI.createWorkbook(snapshot)})You first need to obtain a File object, which you can usually get through file upload or by fetching from a URL. Here is an example code snippet that fetches a .docx file from a URL and converts it into a File object.
const url = 'https://example.com/filename.docx' // Your Word file URL// Function to fetch and convert the URL to a File object.// Here, the fetch API is used to directly obtain the file,// which may need to be modified according to the actual situation,// such as file address authentication and cross-domain issues.async function fetchWordFile(url) { try { const response = await fetch(url) const blob = await response.blob() return new File([blob], 'filename.docx', { type: 'application/vnd.openxmlformats-officedocument.wordprocessingml.document' }) } catch (error) { console.error('Failed to fetch the file:', error) }}// Fetch the file and import it as a snapshot// If the URL file address is not authenticated,// you can directly pass it to the importDocToSnapshotAsync or importDocToUnitIdAsync methodconst file = await fetchWordFile(url)If you are using collaborative editing features, you can use the univerAPI.importDocToUnitIdAsync method to import the .docx file and obtain a unitId, then load the document using the univerAPI.loadServerUnit method.
import { UniverInstanceType } from '@univerjs/core'// When using presets, you can import `UniverInstanceType` from `@univerjs/presets`import { UniverInstanceType } from '@univerjs/presets'univerAPI.importDocToUnitIdAsync(file).then((unitId) => { console.log('Unit ID created:', unitId) univerAPI.loadServerUnit(unitId, UniverInstanceType.UNIVER_DOC)})Or if you just want to import the .docx file as a snapshot (IDocumentData) and render it in the current instance, you can use the univerAPI.importDocToSnapshotAsync method.
// Modify the following code according to the actual situationuniverAPI.importDocToSnapshotAsync(file).then((snapshot) => { console.log('Snapshot created:', snapshot) // Create a new document with the snapshot univerAPI.createDocument(snapshot)})