codemirror-editor-vue3 编辑器只要换行保存就会有小红点
先看示例

找了篇博客写的贼详细 https://blog.csdn.net/xujingyiss/article/details/118992763
只要设置这二个

const cmOptions = {
mode: 'text/x-mysql', // //语言模式
theme: 'neo', // 主题
lineNumbers: false, // 显示行号
smartIndent: true, //智能缩进
indentUnit: 4, // 智能缩进单元长度为 4 个空格
foldGutter: true, // 代码折叠
styleActiveLine: true, // 显示选中行的样式
matchBrackets: true, //每当光标位于匹配的方括号旁边时,都会使其高亮显示
autofocus: true,
showCursorWhenSelecting: true,
autocorrect: true,
spellcheck: true,
specialChars: /[\u0000-\u001f\u007f-\u009f\u00ad\u061c\u200b-\u200f\u2028\u2029\ufeff\ufff9-\ufffc]/g,
specialCharPlaceholder: function (ch) {
let token = document.createElement("span");
let content = "";
token.className = "cm-invalidchar";
if (typeof content == "string") {
token.appendChild(document.createTextNode(content));
}
token.title = "\\u" + ch.charCodeAt(0).toString(16);
token.setAttribute("aria-label", token.title);
return token
},
// 代码折叠
gutters: [
"CodeMirror-lint-markers",
"CodeMirror-linenumbers",
"CodeMirror-foldgutter"
],
foldGutter: true, // 启用行槽中的代码折叠
}
可以看下上面的博客里面或许有你们需要的
改完之后就是下面这样

codemirror-editor-vue3 编辑器只要换行保存就会有小红点的更多相关文章
- Delphi Code Editor 之 编辑器选项
Delphi Code Editor 之 编辑器选项 可从Code Editor的右键菜单中选择“Properties”菜单项来查看编辑器选项.也可以从主菜单[Tools | Editor Optio ...
- python生成组织架构图(网络拓扑图、graph.editor拓扑图编辑器)
Graph.Editor是一款基于HTML5技术的拓补图编辑器,采用jquery插件的形式,是Qunee图形组件的扩展项目,旨在提供可供扩展的拓扑图编辑工具, 拓扑图展示.编辑.导出.保存等功能,此外 ...
- 为 Editor.md 编辑器插件增加预览和发布按钮
前言 一直在使用 Editor.md 插件作为博客的编辑器,用着挺好,但是在全屏下编辑时,每次想预览或者保存又必须切换到非全屏状态下才可以点击按钮,用着不舒服,所以花了一点时间在工具栏上增加了预览.保 ...
- 编辑器插件数据保存之Serializable
Editor数据保存需求 做编辑器插件开发时,当打开一个窗口,对数值进行修改后,在关闭窗口或重新打开Unity时,希望能保存上次的数据. 相关知识 Serialization ,ScriptableO ...
- CodeMirror 在线代码编辑器
像百度编辑器插件部分.菜鸟教程示例等高德地图都在使用,这里也记录一下: CodeMirror是一个用于编辑器文本框textarea代码高亮javascript插件...... vue 中使用 参见:h ...
- CodeMirror在线代码编辑器使用
CodeMirror官网地址为:https://codemirror.net/ CodeMirror作为一款代码编辑器,其应用场景主要是在线网站写代码.如现在的leetcode.洛谷.code-vs等 ...
- sed(seream editor)流编辑器
sed:既然是流编辑器,自然只会是改变输入输出流的内容,对源文件并不进行丝毫修改,不信的话,你可以用cat sourcefille试试啊~ 另,如果你想将修改保存到源文件,可以用输入输出重定向啊~ s ...
- win下python脚本以unix风格换行保存将会报错为编码问题 SyntaxError: encoding problem:gbk
utf-8与gbk编码都报错 从别人的github拉下来一个python脚本. 直接运行,python报错如下: File ".\drag_files_do_event.py", ...
- React Editor 应用编辑器(1) - 拖拽功能剖析
这是可视化编辑器 Gaea-Editor 的第一篇连载分析文章,希望我能在有限的篇幅讲清楚制作这个网页编辑器的动机,以及可能带来的美好使用前景(画大饼).它会具有如下几个特征: 运行在网页 文档流布局 ...
- Editor markdown编辑器
代码示例网址:http://pandao.github.io/editor.md/examples/index.html 引入文件 <link rel="stylesheet" ...
随机推荐
- JavaScript中的事件模型如何理解?
一.事件与事件流 javascript中的事件,可以理解就是在HTML文档或者浏览器中发生的一种交互操作,使得网页具备互动性, 常见的有加载事件.鼠标事件.自定义事件等 由于DOM是一个树结构,如果在 ...
- 使用 Gradio 的“热重载”模式快速开发 AI 应用
在这篇文章中,我将展示如何利用 Gradio 的热重载模式快速构建一个功能齐全的 AI 应用.但在进入正题之前,让我们先了解一下什么是重载模式以及 Gradio 为什么要采用自定义的自动重载逻辑.如果 ...
- 实时数仓入门训练营:基于 Apache Flink + Hologres 的实时推荐系统架构解析
简介: <实时数仓入门训练营>由阿里云研究员王峰.阿里云资深技术专家金晓军.阿里云高级产品专家刘一鸣等实时计算 Flink 版和 Hologres 的多名技术/产品一线专家齐上阵,合力 ...
- [FAQ] GitHub 开启二次验证之后,如何通过 https clone 项目 ?
在 Github Personal Access Tokens 页面,点击生成一个新的 tokon. 此时使用这个 token 作为用户的密码来 clone 项目.
- dotnet 已知问题 错误标记 MethodImplOptions.InternalCall 特性参数将会在类型访问之前抛出 TypeLoadException 异常
本文将记录一个 dotnet 的已知问题.当自己不小心在方法上不正确标记了 MethodImplAttribute 特性时,错误选择了 MethodImplOptions.InternalCall 参 ...
- WPF 通过 RawInput 获取触摸消息
触摸在 Windows 下属于比较特殊的输入,不同于键盘和鼠标,键盘和鼠标可以通过全局 Hook 的方式获取到鼠标和键盘的输入消息.而触摸则没有直接的 Hook 的方法.如果期望自己的应用,可以在没有 ...
- dotnet C# 获取当前设备可移动磁盘
本文告诉大家如何获取当前设备的可移动磁盘 在我的 WPF 应用里面,期望获取到 U 盘的所在盘进行一些有趣的逻辑.可以通过 DriveInfo 类的 GetDrives 获取当前所有的驱动器磁盘 再通 ...
- Codeforces Round 940 (Div. 2) and CodeCraft-23 (A-E)
A. Stickogon 题意:给定 \(n\) 根木棒长度,问最多构成几个多边形. 贪心,四边形不会优于三角形. submission B. A BIT of a Construction 题意:构 ...
- MacOS安装gprMax教程
原文发布于:https://blog.zhaoxuan.site/archives/19.html: 第一时间获取最新文章请关注博客个人站:https://blog.zhaoxuan.site. 1. ...
- C 编程异常 — implicit declaration of function 'free' is invalid in C99
环境:MAC pro 问题:在编译程序的触发异常. main.c:17:9: warning: implicit declaration of function 'free' is invalid i ...