表格
Board 的表格支援分為模型套件與 UI 套件。若瀏覽器編輯器需要在 Board 畫布上編輯表格元素,請同時註冊這兩個套件。
註冊表格支援
TypeScript
import { UniverBoardsTablePlugin } from '@univerjs-pro/boards-table'import { UniverBoardsTableUIPlugin } from '@univerjs-pro/boards-table-ui'import BoardsTableUIEnUS from '@univerjs-pro/boards-table-ui/locale/en-US'import '@univerjs-pro/boards-table/facade'import '@univerjs-pro/boards-table-ui/lib/index.css'univer.registerPlugin(UniverBoardsTablePlugin)univer.registerPlugin(UniverBoardsTableUIPlugin)行動裝置支援
先設定行動版編輯器。在本頁外掛模式的初始化程式碼中,將下列桌面版註冊替換為同一套件匯出的行動版外掛,並在開啟文件前完成。保留模型外掛、樣式、語言套件與 Facade 匯入,請勿同時註冊兩個版本。
| 套件 | 桌面版註冊 | 行動版註冊 |
|---|---|---|
@univerjs-pro/boards-table-ui | UniverBoardsTableUIPlugin | UniverBoardsTableMobileUIPlugin |
套件職責
@univerjs-pro/boards-table將表格元素整合至 Board 模型。@univerjs-pro/boards-table-ui在 Board 畫布上加入表格的渲染與編輯 UI,並為瀏覽器編輯器提供@univerjs-pro/boards-table-ui/locale/*和@univerjs-pro/boards-table-ui/lib/index.css。
快照資料
Board 表格元素會儲存 tableId 與 Board 元素的共用欄位。表格資料由表格外掛管理,並透過 Board 資源加以參照。
TypeScript
const table = board.insertTable({ left: 120, top: 120, width: 480, height: 280, rows: 3, columns: 4,})if (!table) throw new Error('Cannot insert Board table')開啟含有 table 元素的快照前,請先註冊表格支援。
穩定的表格色彩
插入 Board 表格或變更其樣式時,外掛會將解析後的主題色盤與該表格一併儲存。因此,即使全域 Univer 主題發生變化,既有表格仍會保留原本的色彩;選取其他樣式時則會建立該表格自有的新主題快照。
你覺得這篇文檔如何?