UI 概要
@univerjs-pro/bases-ui は、ライセンスが必要な Univer Bases のブラウザーワークベンチを提供します。テーブルとビューのナビゲーション、グリッド、カンバン、カレンダー、ガント、ギャラリーの各ビュー、フィールドエディター、レコード詳細、メニュー、選択状態を描画します。
ワークベンチを登録する
Bases プラグインより先に ライセンスと数式エンジンを登録します。数式フィールドは @univerjs-pro/engine-formula を使用し、Sheets アプリケーションは必要ありません。
TypeScript
univer.registerPlugin(UniverLicensePlugin, { license: process.env.CLIENT_LICENSE_TEXT,})univer.registerPlugin(UniverProFormulaEnginePlugin)univer.registerPlugin(UniverRenderEnginePlugin)univer.registerPlugin(UniverUIPlugin, { container: 'app' })univer.registerPlugin(UniverBasesPlugin)univer.registerPlugin(UniverBasesUIPlugin)インポート、スタイル、ロケールについてはインストールと基本的な使い方を参照してください。
初期レイアウトを設定する
IUniverBaseUIConfig はワークベンチの領域と、起動時に表示するテーブルおよびビューを制御します。
TypeScript
univer.registerPlugin(UniverBasesUIPlugin, { workbench: { header: true, headerMenu: true, content: true, leftSidebar: true, rightSidebar: false, rightPanelMode: 'dock', }, initialState: { tableId: 'tasks', viewId: 'kanban', },})読み取り専用にする場合は disableEdit を使用します。対応するフィールドがホスト提供データを必要とする場合だけ、attachment、personOptions、groupOptions を設定してください。
このガイドはいかがですか?