评论 0.2.10+
Facade API | 付费版本 | 需要 Univer 服务端 | Univer on Node.js | Preset |
---|---|---|---|---|
✅ | - | 可选 | - | UniverSheetsThreadCommentPreset |
评论插件提供了对单元格进行评论的功能。
该功能包含以下插件包:
@univerjs/thread-comment
- 基础评论插件@univerjs/thread-comment-ui
- 基础评论 UI 插件@univerjs/sheets-thread-comment
- sheet 评论插件@univerjs/sheets-thread-comment-ui
- sheet 评论插件@univerjs-pro/thread-comment-datasource
- 和协同编辑一起使用时的评论数据源插件
Presets 安装
import { createUniver, defaultTheme, LocaleType, Tools } from '@univerjs/presets';
import { UniverSheetsCorePreset } from '@univerjs/presets/preset-sheets-core';
import UniverPresetSheetsCoreZhCN from '@univerjs/presets/preset-sheets-core/locales/zh-CN';
import { UniverSheetsThreadCommentPreset } from '@univerjs/presets/preset-sheets-thread-comment';
import sheetsThreadCommentZhCN from '@univerjs/presets/preset-sheets-thread-comment/locales/zh-CN';
createUniver({
locale: LocaleType.ZH_CN,
locales: {
zhCN: Tools.deepMerge(
{},
UniverPresetSheetsCoreZhCN,
sheetsThreadCommentZhCN
),
},
theme: defaultTheme,
collaboration: true,
presets: [
UniverSheetsCorePreset(),
UniverSheetsThreadCommentPreset(),
],
});
如果同时使用 Univer 协同功能,则需要提供配置:
- UniverSheetsThreadCommentPreset(),
+ UniverSheetsThreadCommentPreset({ collaboration: true }),
高级安装
npm install @univerjs/sheets-thread-comment @univerjs/sheets-thread-comment-ui @univerjs/thread-comment @univerjs/thread-comment-ui
import { LocaleType, Tools } from '@univerjs/core';
import { IThreadCommentMentionDataService, UniverThreadCommentUIPlugin } from '@univerjs/thread-comment-ui';
import { UniverThreadCommentPlugin } from '@univerjs/thread-comment';
import { UniverSheetsThreadCommentPlugin } from '@univerjs/sheets-thread-comment';
import { UniverSheetsThreadCommentUIPlugin } from '@univerjs/sheets-thread-comment-ui';
import ThreadCommentUIZhCN from '@univerjs/thread-comment-ui/locale/zh-CN';
import SheetsThreadCommentZhCN from '@univerjs/sheets-thread-comment/locale/zh-CN';
import '@univerjs/thread-comment-ui/lib/index.css';
import '@univerjs/sheets-thread-comment/facade';
const univer = new Univer({
theme: defaultTheme,
locale: LocaleType.ZH_CN,
locales: {
[LocaleType.ZH_CN]: Tools.deepMerge(
ThreadCommentUIZhCN,
SheetsThreadCommentZhCN
),
},
});
univer.registerPlugin(UniverThreadCommentPlugin);
univer.registerPlugin(UniverThreadCommentUIPlugin);
univer.registerPlugin(UniverSheetsThreadCommentBasePlugin);
univer.registerPlugin(UniverSheetsThreadCommentPlugin);
如果同时使用 Univer 协同功能,则需要:
npm install @univerjs-pro/thread-comment-datasource
import { UniverThreadCommentDataSourcePlugin } from '@univerjs-pro/thread-comment-datasource';
univer.registerPlugin(UniverThreadCommentDataSourcePlugin);
Facade API
const univerAPI = FUniver.newAPI(univer);
// get cell
const workbook = univerAPI.getActiveWorkbook();
const worksheet = workbook.getActiveSheet();
// comment only attch to single cell, if range is A1:J10 equal A1
const range = worksheet.getRange(0, 0, 1, 1);
// add comment to empty cell
range.addComment({
dataStream: 'hello world\r\n',
});
// reply to current comment
range.addComment({
dataStream: 'reply\r\n',
});
range.clearComment();
// get comment
const comment = range.getComment();
// update content
comment?.update({
dataStream: 'hello world222\r\n',
});
// delete comment
comment?.delete();
// resolve comment
comment?.resolve();
// get replies
comment?.getReplies();
// get range of this comment
comment?.getRange();
// event
workbook.onBeforeUpdateThreadComment
workbook.onBeforeDeleteThreadComment
workbook.onBeforeAddThreadComment
// comment change event include add, update, delete
workbook.onThreadCommentChange