大家好,今天小编来为大家解答以下的问题，关于ueditor后端编辑高亮，ueditor后端编辑高亮这个很多人还不知道，现在让我们一起来看看吧！
最后选择了only-office和canvas-editor
附上本地运行demo:
一、安装docker二、安装并启动 Onlyoffice 服务：
docker run -i -t -d -p 8701:80 onlyoffice/documentserver:版本号
如果是第 1 次执行这个命令，会先去下载 Onlyoffice，比较慢，约等待 3~10 分钟，网络畅通一点的会快一些。如果是已经安装过则直接进行启动。
三、启动内置服务
# 启动所有的内置服务supervisorctl restart all# 退出容器exit
最后访问 页面（这里要注意，IP 不能是 localhost 和 127.0.0.1，一定要用真实 IP 来访问）
因为开发周期，后端又比较懒不想花时间去看文档。这一方案被我放弃了
最后选择了canvas-editor
canvas-editor
在vue中主要实现方式就是采用开源项目代码。
在组件模块，新建vue文件，html采用开源项目代码，分3个部分，工具栏，侧边菜单，主要内容，底部工具，旁边批注。通过import引入开源样式，注意样式冲突。在onMounted，采用开源main.ts _window.onload代码。
const instance = new Editor( document.querySelector('#canvasEditor'), { header: props.header, main: props.main, footer: props.footer }, options);console.log('实例', instance);editorRef.value = instance;// 工具栏方法 例：// 2. | 撤销 | 重做 | 格式刷 | 清除格式 |const undoDom = document.querySelector('.menu-item__undo'); undoDom.title = `撤销(${isApple ? '?' : 'Ctrl'}+Z)`; undoDom.onclick = function () { console.log('undo'); instance.command.executeUndo();};
例：
interface IHeader { top?: number // 距离页面顶部大小。默认：30 maxHeightRadio?: MaxHeightRatio // 占页面最大高度比。默认：HALF disabled?: boolean // 是否禁用}页码配置
interface IPageNumber { bottom?: number // 距离页面底部大小。默认：60 size?: number // 字体大小。默认：12 font?: string // 字体。默认：Microsoft YaHei color?: string // 字体颜色。默认：# rowFlex?: RowFlex // 行对齐方式。默认：CENTER format?: string // 页码格式。默认：{pageNo}。示例：第{pageNo}页/共{pageCount}页 numberType?: NumberType // 数字类型。默认：ARABIC disabled?: boolean // 是否禁用 startPageNo?: number // 起始页码。默认：1 fromPageNo?: number // 从第几页开始出现页码。默认：0}水印配置
interface IWatermark { data: string // 文本。 color?: string // 颜色。默认：#AEB5C0 opacity?: number // 透明度。默认：0.3 size?: number // 字体大小。默认：200 font?: string // 字体。默认：Microsoft YaHei}占位文本配置
以上是关于ueditor后端编辑高亮的相关信息，了解更多关于内容请继续关注本站。
