codemirror 相关问题

CodeMirror是一个用JavaScript编写的浏览器内代码编辑器。其显着的功能包括语法高亮,代码完成,自动格式化和键绑定。代码辅助和突出显示功能被编写为称为“模式”的插件,编辑器支持多种开箱即用的语言,但可以扩展以添加对任何所需语言的支持。

如何使用 Javascript 设置 CodeMirror 编辑器的值?

我尝试在以下代码中设置id4: &... 我尝试在以下代码中设置id4: <div id="id1"> <div id="id2"> <div id="id3"> <textarea id="id4"></textarea> </div> </div> </div> 通过使用此代码: document.getElementById('id4').value = "..."; 还有这个: document.getElementById('id3').getElementsByTagName('textarea')[0].value = "..."; 但是没有任何作用。 更新: textarea 已被 CodeMirror 编辑器取代。我如何为其设置值? 非常感谢您的帮助! 自 3.0 发布以来,执行此操作的方式略有变化。现在是这样的: var textArea = document.getElementById('myScript'); var editor = CodeMirror.fromTextArea(textArea); editor.getDoc().setValue('var msg = "Hi";'); 我喜欢例子。试试这个: CodeMirror.fromTextArea(document.getElementById(id), { lineNumbers: true }).setValue("your code here"); 正如你所说,textarea被Codemirror取代了。但它被类为“CodeMirror”的元素所取代。您可以使用 querySelector 来获取元素。当前的 CodeMirror 实例(及其方法)附加到此元素。所以你可以这样做: document.querySelector('.CodeMirror').CodeMirror.setValue('VALUE') CodeMirror ~4.6.0 你可以这样做,假设你有一个 codemirror 对象: var currentValue = myCodeMirrorObject.cm.getValue(); var str = 'some new value'; myCodeMirrorObject.cm.setValue(str); 您拥有的代码应该可以工作。失败的最可能的解释是元素在运行时不存在。如果是这样,解决方案是: 移动 JS,使其出现在创建元素之后(例如,到</body>之前)延迟 JS 的执行,直到创建元素(例如,将其移动到您指定为 onload 事件处理程序的函数) 这对我的(相当旧的)版本的 CodeMirror 有效: var editor=CodeMirror.fromTextArea('textarea_id'); editor.setCode('your string'); editor.setValue(“YOUR_VALUE”);

回答 7 投票 0

如何在codemirror文本编辑器中使用onchange、onmouseup事件

我正在使用我的文本编辑器作为代码镜像。通常,当我尝试在textarea中使用像onmouseup、onchange、oninput这样的dom事件时,它可以工作,但是在集成codemirror之后,它不起作用。请...

回答 2 投票 0

有没有办法禁用codemirror上的鼠标操作?

如何在 codemirror 中禁用鼠标使用。 我希望它的行为像 vim 编辑器,用户无法使用鼠标移动到任何地方。 预先感谢。

回答 3 投票 0

代码镜像初始绑定

我正在使用Codemirror。我的代码不使用 ES6 模块。我想知道 如何获取 Vim 对象?在 Codemirror Vim 自述文件中,我们看到: 从“@replit/codemirror-vi...

回答 1 投票 0

在react 18版本中安装codemirror

使用 npm install react-codemirror2 codemirror pyodide 安装收到错误: 如何解决此错误 在此处输入图像描述 我正在尝试所有这样的命令: npm install --leg...

回答 1 投票 0

导入时出错:'codemirror/lib/codemirror.css'

代码: 从“反应”导入反应 导入 'codemirror/lib/codemirror.css'; 导出默认函数Editor() { 返回 ( 编辑器 ) } 错误: 找不到模块:错误:...

回答 1 投票 0

尝试用CSS更新代码镜像文本区域,但它没有改变任何东西

现在我正在尝试在浏览器中创建一个代码编辑器。 对于语法突出显示,我选择使用代码镜像。代码镜像的问题在于,当我们使用代码镜像时“对象”...

回答 1 投票 0

如何更改所选文本的颜色?

我需要使用codemirror更改所选文本的背景颜色。 有人可以帮忙吗?

回答 6 投票 0

带有拼写检查器的CodeMirror

我想使用 CodeMirror 的功能(例如行号、换行、搜索等)来处理纯文本,不需要特别突出代码,而是使用 Google Chrome 拼写

回答 7 投票 0

CodeMirror 在 Nextjs 中状态更改或组件重新渲染时破坏了其样式。在开发期间一切正常,但在生产中却不行

我在我的Nextjs项目中使用react-codemirror版本^4.20.2。开发环境一切正常。但是当我在 Vercel 上部署 Nextjs 应用程序时,Codemirror 组件破坏了它

回答 1 投票 0

如何清除CodeMirror 6中的撤消历史记录?

editor.clearHistory();我相信 CodeMirror 5 可以工作,但是 CodeMirror 6 呢?

回答 2 投票 0

将 JS 文件导入 Next JS - 出现引用错误

尝试在 Next JS 项目中导入 js 文件时出现以下错误。 错误: ReferenceError:导航器未定义 这是我用来插入文件的组件。我需要我...

回答 2 投票 0

如何使用uiw/react-codemirror作为react-hook-form字段

我想使用CodeMirror编辑器作为使用react-hook-form的表单中的字段。有没有人以前做过这个以及如何使用反应钩子表单注册方法注册编辑器值?

回答 1 投票 0

CodeMirror 编辑器复制

所以我尝试将代码编辑器插入我的网络应用程序中。 我正在尝试导入并添加 Codemirror 的实例。 每次我为 CodeMirror 组件添加 JSX 代码时,它都会重复。 这是我的

回答 2 投票 0

@uiw/react-codemirror 滚动

我正在使用 uiw-react codemirror。我使用 uiw codemirror 提供的 classnameExt 函数将类名添加到 codemirror 中的特定行。我可以访问类名和行号...

回答 1 投票 0

如何禁用 CodeMirror 中默认的插入键行为?

我正在使用 CodeMirror 进行代码编辑,当我按 INS(插入键)时,它的行为就像在任何普通文本编辑器中一样,在改写和插入模式之间切换,但我不希望这样。 我想要它是

回答 2 投票 0

Typo3后端t3editor自定义模式

版本:Typo3 v11、CodeMirror v5、浏览器:Firefox 概括: 我有一个 Typo3 扩展,我想为其添加自定义语法突出显示。这应该可以使用内置的 t3edi...

回答 1 投票 0

代码镜像。替换文本的简单方法?

我使用CodeMirror(5.58.2)来编辑文本。 new_cm = CodeMirror.fromTextArea(textarea_obj, param); 但在文本区域中,我可以轻松替换文本,只需执行以下操作 obj.value = obj.value.replace( /123/g, ...

回答 2 投票 0

Selenium 在浏览器中看不到可见的 CodeMirror 元素

这是我尝试使用 Selenium 进行交互的元素的 HTML: 这是我尝试使用 Selenium 进行交互的元素的 HTML: <div class="EasyMDEContainer" role="application"><div class="editor-toolbar" role="toolbar"><button class="heading" type="button" title="Heading (Ctrl-H)" aria-label="Heading" tabindex="-1"><i class="fa fa-header fa-heading"></i></button><i class="separator">|</i><button class="bold" type="button" title="Bold (Ctrl-B)" aria-label="Bold" tabindex="-1"><i class="fa fa-bold"></i></button><button class="italic" type="button" title="Italic (Ctrl-I)" aria-label="Italic" tabindex="-1"><i class="fa fa-italic"></i></button><i class="separator">|</i><button class="preview no-disable" type="button" title="Toggle Preview (Ctrl-P)" aria-label="Toggle Preview" tabindex="-1"><i class="fa fa-eye"></i></button></div><div class="CodeMirror cm-s-easymde CodeMirror-wrap" translate="no" style="clip-path: inset(0px);"><div style="overflow: hidden; position: relative; width: 3px; height: 0px; top: 87.1354px; left: 36.3368px;"><textarea autocorrect="off" autocapitalize="off" spellcheck="false" style="position: absolute; bottom: -1em; padding: 0px; width: 1000px; height: 1em; min-height: 1em; outline: none;" tabindex="0"></textarea></div><div class="CodeMirror-vscrollbar" tabindex="-1" cm-not-content="true"><div style="min-width: 1px; height: 0px;"></div></div><div class="CodeMirror-hscrollbar" tabindex="-1" cm-not-content="true"><div style="height: 100%; min-height: 1px; width: 0px;"></div></div><div class="CodeMirror-scrollbar-filler" cm-not-content="true"></div><div class="CodeMirror-gutter-filler" cm-not-content="true"></div><div class="CodeMirror-scroll" tabindex="-1" style="min-height: 300px; height: 300px;"><div class="CodeMirror-sizer" style="margin-left: 0px; margin-bottom: -19px; border-right-width: 31px; min-height: 296px; padding-right: 0px; padding-bottom: 0px;"><div style="position: relative; top: 0px;"><div class="CodeMirror-lines" role="presentation"><div role="presentation" style="position: relative; outline: none;"><div class="CodeMirror-measure"><pre class="CodeMirror-line-like">x</pre></div><div class="CodeMirror-measure"></div><div style="position: relative; z-index: 1;"></div><div class="CodeMirror-cursors" style=""><div class="CodeMirror-cursor" style="left: 25.2257px; top: 72.0313px; height: 24.0104px;">&nbsp;</div></div><div class="CodeMirror-code" role="presentation"><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;">sfas sasdf ad sd sd sdfdsfdsfdsfdsfdfsdf</span></pre><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;">sdfsdf</span></pre><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;"><span cm-text="">​</span></span></pre><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;">sdf</span></pre><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;">sd</span></pre><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;">f</span></pre><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;">ds</span></pre><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;">f</span></pre><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;"><span cm-text="">​</span></span></pre><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;"><span cm-text="">​</span></span></pre><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;"><span cm-text="">​</span></span></pre><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;">fsdfsdfdseds</span></pre></div></div></div></div></div><div style="position: absolute; height: 31px; width: 1px; border-bottom: 0px solid transparent; top: 296px;"></div><div class="CodeMirror-gutters" style="display: none; height: 327px;"></div></div><div class="editor-preview-full editor-preview"></div></div><div class="editor-preview-side editor-preview" style="height: 322px;"></div></div> 这是一个示例脚本: element = driver.find_element(By.XPATH, "//div[@class='CodeMirror cm-s-easymde CodeMirror-wrap']//textarea") 我收到元素不可见错误。 但是,当我在 Chrome 开发工具中观察相同的元素时,它是可见的。 这不是等待它可见或位于 iframe 中的问题。 我想知道这是什么问题? 更新: 问题似乎出在 CodeMirror JS 库上。我尝试使用 JS 执行器来更改 innerHTML、value 和 textContent,但即使文本显然已写入框中,但保存后它不会保留。 问题是我在使用普通的 selenium click/set_value 方法时无法看到动态 CodeMirror 元素。 我设法用 JS 执行器做到这一点 driver.execute_script(f'arguments[0].CodeMirror.setValue({value})', element)

回答 1 投票 0

vite 中的 Codemirror 会做出反应吗?

如何在vite React中安装Codemirror? 我尝试过 npm install react-codemirror2 --legacy-peer-deps 但不起作用,并且显示错误 无法解析导入“codemirror/lib/

回答 1 投票 0

© www.soinside.com 2019 - 2024. All rights reserved.