Web SDK

引用區塊

插件信息

引用區塊功能允許您在文件中插入和格式化引用文字，並套用與一般內容不同的視覺樣式。

介紹

在 Univer Docs 中，引用區塊使您能夠：

  • 格式化引用文字：為引文套用獨特的樣式。
  • 巢狀內容：在引用區塊中包含富文字內容。
  • 輕鬆退出：快速從空段落退出引用格式。

外掛模式

安裝

Shell
pnpm add @univerjs-pro/docs-quote @univerjs-pro/docs-quote-ui

使用

TypeScript
import { UniverDocsQuotePlugin } from '@univerjs-pro/docs-quote'import { UniverDocsQuoteUIPlugin } from '@univerjs-pro/docs-quote-ui'import DocsQuoteUIZhTW from '@univerjs-pro/docs-quote-ui/locale/zh-TW'import { LocaleType, mergeLocales, Univer } from '@univerjs/core'import '@univerjs-pro/docs-quote-ui/lib/index.css'const univer = new Univer({  locale: LocaleType.ZH_TW,  locales: {    [LocaleType.ZH_TW]: mergeLocales(      DocsQuoteUIZhTW,     ),  },})univer.registerPlugin(UniverDocsQuotePlugin)univer.registerPlugin(UniverDocsQuoteUIPlugin)

如果您擁有 Univer 商業授權，請參閱在用戶端使用授權進行配置。

行動裝置支援

先設定行動版編輯器。在本頁外掛模式的初始化程式碼中，將下列桌面版註冊替換為同一套件匯出的行動版外掛，並在開啟文件前完成。保留模型外掛、樣式、語言套件與 Facade 匯入，請勿同時註冊兩個版本。

套件桌面版註冊行動版註冊
@univerjs-pro/docs-quote-uiUniverDocsQuoteUIPluginUniverDocsQuoteMobileUIPlugin

Facade API

使用 API 前請確保已匯入 facade：

TypeScript
import '@univerjs-pro/docs-quote/facade'

取得所有引用區塊

TypeScript
const doc = univerAPI.getActiveDocument()const quotes = doc?.getQuotes() ?? []

插入引用區塊

TypeScript
const doc = univerAPI.getActiveDocument()const quote = doc?.insertQuote({  startOffset: 12,  endOffset: 35,})

設定引用線顏色

TypeScript
const quote = univerAPI.getActiveDocument()?.getQuote('quote-block-id')quote?.setLineColor('#5B5FC7')

設定引用文字顏色

TypeScript
const quote = univerAPI.getActiveDocument()?.getQuote('quote-block-id')quote?.setTextColor('#242424')

你覺得這篇文檔如何？

© 2026 DreamNum Co., Ltd.