Web SDK

十字高亮

插件信息

十字高亮將使用者選中的單元格所在行列突出顯示，以便使用者更容易地識別當前選中的單元格。

外掛模式

安裝

Shell
pnpm add @univerjs/sheets-crosshair-highlight

使用

TypeScript
import { LocaleType, mergeLocales, Univer } from '@univerjs/core'import { UniverSheetsCrosshairHighlightPlugin } from '@univerjs/sheets-crosshair-highlight'import SheetsCrosshairHighlightZhTW from '@univerjs/sheets-crosshair-highlight/locale/zh-TW'import '@univerjs/sheets-crosshair-highlight/lib/index.css'import '@univerjs/sheets-crosshair-highlight/facade'const univer = new Univer({  locale: LocaleType.ZH_TW,  locales: {    [LocaleType.ZH_TW]: mergeLocales(      SheetsCrosshairHighlightZhTW,     ),  },})univer.registerPlugin(UniverSheetsCrosshairHighlightPlugin)

行動裝置支援

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

套件桌面版註冊行動版註冊
@univerjs/sheets-crosshair-highlightUniverSheetsCrosshairHighlightPluginUniverSheetsCrosshairHighlightMobileUIPlugin

預設模式

十字高亮並未提供預設模式，但支援與其外掛混用。

Shell
pnpm add @univerjs/sheets-crosshair-highlight

使用

TypeScript
import UniverPresetSheetsCoreZhTW from '@univerjs/preset-sheets-core/locales/zh-TW'import { UniverSheetsCrosshairHighlightPlugin } from '@univerjs/sheets-crosshair-highlight'import '@univerjs/sheets-crosshair-highlight/facade'import '@univerjs/sheets-crosshair-highlight/lib/index.css'const { univerAPI } = createUniver({  locale: LocaleType.ZH_TW,  locales: {    [LocaleType.ZH_TW]: mergeLocales(      UniverPresetSheetsCoreZhTW,      SheetsCrosshairHighlightZhTW,     ),  },  presets: [    UniverSheetsCorePreset(),  ],  plugins: [    UniverSheetsCrosshairHighlightPlugin,   ],})

Facade API

完整 Facade API 型別定義，請檢視 FacadeAPI。

引入

外掛模式提示

僅外掛模式需要手動引入 Facade 套件。預設模式已內建對應的 Facade 套件，無需額外引入。

TypeScript
import '@univerjs/sheets-crosshair-highlight/facade'

切換十字高亮開關

TypeScript
univerAPI.setCrosshairHighlightEnabled(true)univerAPI.setCrosshairHighlightEnabled(false)

獲取十字高亮開關狀態

TypeScript
univerAPI.getCrosshairHighlightEnabled()

事件監聽

完整事件型別定義，請檢視 Events。

CrosshairHighlightEnabledChanged 事件將在十字高亮開關狀態發生變化時觸發。

TypeScript
const disposable = univerAPI.addEvent(univerAPI.Event.CrosshairHighlightEnabledChanged, (params) => {  const { enabled, workbook, worksheet } = params})// 移除事件監聽器，使用 `disposable.dispose()`

CrosshairHighlightColorChanged 事件將在十字高亮顏色發生變化時觸發。

TypeScript
const disposable = univerAPI.addEvent(univerAPI.Event.CrosshairHighlightColorChanged, (params) => {  const { color, workbook, worksheet } = params})// 移除事件監聽器，使用 `disposable.dispose()`

你覺得這篇文檔如何？

© 2026 DreamNum Co., Ltd.