Комментарии
Комментарии позволяют пользователям оставлять в документах комментарии и ответы, упрощая общение и совместную работу участников команды.
Режим плагинов
Установка
pnpm add @univerjs/thread-comment @univerjs/thread-comment-ui @univerjs/docs-thread-comment @univerjs/docs-thread-comment-uinpm install @univerjs/thread-comment @univerjs/thread-comment-ui @univerjs/docs-thread-comment @univerjs/docs-thread-comment-uiyarn add @univerjs/thread-comment @univerjs/thread-comment-ui @univerjs/docs-thread-comment @univerjs/docs-thread-comment-uibun add @univerjs/thread-comment @univerjs/thread-comment-ui @univerjs/docs-thread-comment @univerjs/docs-thread-comment-uiИспользование
import { LocaleType, mergeLocales, Univer } from '@univerjs/core'import { UniverDocsThreadCommentPlugin } from '@univerjs/docs-thread-comment'import { UniverDocsThreadCommentUIPlugin } from '@univerjs/docs-thread-comment-ui'import { UniverThreadCommentPlugin } from '@univerjs/thread-comment'import { UniverThreadCommentUIPlugin } from '@univerjs/thread-comment-ui'import DocsCommentLocale from '@univerjs/docs-thread-comment-ui/locale/en-US'import ThreadCommentUIEnUS from '@univerjs/thread-comment-ui/locale/en-US'import '@univerjs/docs-thread-comment/facade'import '@univerjs/docs-thread-comment-ui/lib/index.css'import '@univerjs/thread-comment-ui/lib/index.css'const univer = new Univer({ locale: LocaleType.EN_US, locales: { [LocaleType.EN_US]: mergeLocales( ThreadCommentUIEnUS, DocsCommentLocale, ), },})univer.registerPlugin(UniverThreadCommentPlugin)univer.registerPlugin(UniverThreadCommentUIPlugin)univer.registerPlugin(UniverDocsThreadCommentPlugin)univer.registerPlugin(UniverDocsThreadCommentUIPlugin)Использование с функцией совместной работы
Если вы используете функцию совместной работы, настройте её следующим образом:
pnpm add @univerjs-pro/thread-comment-datasourcenpm install @univerjs-pro/thread-comment-datasourceyarn add @univerjs-pro/thread-comment-datasourcebun add @univerjs-pro/thread-comment-datasourceimport { UniverThreadCommentDataSourcePlugin } from '@univerjs-pro/thread-comment-datasource'univer.registerPlugin(UniverThreadCommentDataSourcePlugin)Поддержка мобильных устройств
Сначала настройте мобильный редактор. В коде инициализации режима плагинов на этой странице замените указанные настольные регистрации мобильными экспортами тех же пакетов до открытия документа. Сохраните модели, стили, локализации и импорты Facade; не регистрируйте оба варианта.
| Пакет | Настольная регистрация | Мобильная регистрация |
|---|---|---|
@univerjs/docs-thread-comment-ui | UniverDocsThreadCommentUIPlugin | UniverDocsThreadCommentMobileUIPlugin |
@univerjs/thread-comment-ui | UniverThreadCommentUIPlugin | UniverThreadCommentMobileUIPlugin |
Режим предустановок
Установка
pnpm add @univerjs/preset-docs-thread-commentnpm install @univerjs/preset-docs-thread-commentyarn add @univerjs/preset-docs-thread-commentbun add @univerjs/preset-docs-thread-commentИспользование
import { UniverDocsCorePreset } from '@univerjs/preset-docs-core'import UniverPresetDocsCoreEnUS from '@univerjs/preset-docs-core/locales/en-US'import { UniverDocsThreadCommentPreset } from '@univerjs/preset-docs-thread-comment'import UniverPresetDocsThreadCommentEnUS from '@univerjs/preset-docs-thread-comment/locales/en-US'import { createUniver, LocaleType, mergeLocales } from '@univerjs/presets'import '@univerjs/preset-docs-core/lib/index.css'import '@univerjs/preset-docs-thread-comment/lib/index.css'const { univerAPI } = createUniver({ locale: LocaleType.EN_US, locales: { [LocaleType.EN_US]: mergeLocales( UniverPresetDocsCoreEnUS, UniverPresetDocsThreadCommentEnUS, ), }, presets: [ UniverDocsCorePreset(), UniverDocsThreadCommentPreset(), ],})Facade комментариев
Импортируйте общую Facade комментариев и Facade продукта. Методы продукта создают стабильные привязки, общая API управляет ответами, изменениями, разрешением и удалением. getComments() читает локальное состояние. listCommentsAsync() синхронизирует уже известные обсуждения через настроенный источник, но не обнаруживает все обсуждения на сервере.
import '@univerjs/thread-comment/facade'import '@univerjs/docs-thread-comment/facade'const range = univerAPI.getActiveDocument()?.getTextRange(0, 1)if (range) { await range.createCommentAsync('Please review this text.') console.log(await range.listCommentsAsync())}import '@univerjs/thread-comment/facade'const [thread] = univerAPI.getComments({ resolved: false })if (thread) { await univerAPI.replyCommentAsync({ unitId: thread.unitId, subUnitId: thread.subUnitId, threadId: thread.threadId, content: 'Reviewed.', })}Общие обсуждения
Интегрируйте Comment Service и Endpoint через Server SDK, затем после настройки совместного редактирования и лицензии зарегистрируйте UniverThreadCommentDataSourcePlugin из @univerjs-pro/thread-comment-datasource. Источник использует /universer-api/comment/unit/{unitId}/... и /universer-api/user/list: предоставьте эти маршруты в приложении. Сервер должен отдельно проверять права на чтение и запись комментариев, не полагаясь на право редактирования документа.
Насколько полезно это руководство?