问题标签 [react-ace]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
1 回答
575 浏览

reactjs - 使用 react-ace 我想添加当前不支持的模式 php

对于https://github.com/securingsincity/react-ace

我知道文档不支持模式 php - 但我想使用它。

有没有办法包括添加它的步骤?https://ace.c9.io似乎支持它 - 有没有简单的方法来添加额外的模式/主题?

0 投票
1 回答
1061 浏览

javascript - 如何禁用特定的 ACE 编辑器 CSS 模式警告规则?

我的项目使用Ace 编辑器(通过BraceReact-Ace)。

我们将mode编辑器的设置为"css"并将其嵌入到我们的页面中。这工作得很好,但是,默认情况下,我们发现一些启用的 CSS 规则突出显示过于严格——一些警告应该是“信息”;一些错误应该是“警告”。

我们如何禁用/启用/修改 Ace 编辑器在 CSS 模式下用于信息、错误和警告的验证规则集?

我相信我在 Ace CSS worker 中找到了相关的代码行,但我不确定如何使用它,也不确定在哪里可以找到验证规则名称的详尽列表,如果我知道如何使用此功能。

下面的代码本质上是我们用来实例化 react ace 组件的代码......

0 投票
1 回答
1672 浏览

reactjs - 有没有办法改变 react-ace 编辑器默认 Scroller 的样式?

我正在制作一个网页,其中 react-ace 编辑器占据页面宽度的 50% 和页面高度的 90%。在编辑器在编写一些代码时有一个垂直滚动条后,我想为显示的默认垂直滚动条设置样式。

我可以使用 -

通过将 reactAceComponent ref 放在 Editor 上。

之后,我可以更改 Scroller 的高度和宽度等。但是如何设置 Scroller 本身的样式?

假设我想给滚动条一个类“style-scroller”并做这样的事情:

是否可以为滚动条提供自定义样式?我什至从哪里开始?请帮我。

0 投票
1 回答
318 浏览

reactjs - 如何摆脱 AceEditor 组件中出现的垂直线?

我在我的反应组件中使用 react-ace

这是他们在 npmjs 上提供的示例(加上一点服装):

当我编译并执行此代码时,我得到下图中的结果 在此处输入图像描述

但正如您所见,视图中有一条垂直线..我该如何摆脱它?

0 投票
0 回答
167 浏览

r - 使用 react-ace 突出显示 R 语言语法

是否可以在 AceEditor (react-ace) 上突出显示用 R 编写的语法错误。

我正在尝试使用 react ace 编辑器来实现 Online R IDE。

此代码工作正常,但不会突出显示不正确的语法。

0 投票
1 回答
1877 浏览

ace-editor - 如何从语言工具之外的反应王牌编辑器中添加自定义完成器

如何使用 addCompleter 或 setCompleter 等函数从 index.js 在基于反应的 ace 编辑器中添加自定义完成器

我想从这里添加我的自定义完成者。我的完成者是这样的

在普通的 Ace 编辑器中它是直截了当的。只需调用

0 投票
1 回答
195 浏览

reactjs - 非被动事件侦听器导致“阻塞”代码(使用 React Ace)并因此导致性能问题

我的项目涉及创建涉及 React Ace 来编写或编辑代码的卡片(如抽认卡)。一个用户的主页可以有多个抽认卡。(在这里查看工作项目 - https://visit-sparkle.apricity.co.in。对于喜欢 TL;DR 的人有一个“演示”部分)

现在,虽然这些卡可以正常加载,但我认为这是由于 React-ace 的非被动事件处理导致了一段代码的阻塞,从而非常非常糟糕地减慢了我的页面渲染速度。

在此处输入图像描述

性能成本由此产生: 在此处输入图像描述

重现代码:

Google 建议使用 {passive: true} 强制执行一个对象,以从根本上提高性能。我们如何使用 React-Ace 实现这一点?他们的文档似乎没有帮助。

感谢所有帮助。谢谢

0 投票
1 回答
1000 浏览

reactjs - 使用 react-ace diff 组件无法显示 diff 变化

在此处输入图像描述 我想展示两个侧面内容之间的不同变化,但结果并没有显示出我期望的结果。没有显示任何变化。

我使用的 react-ace 版本是 7.0.5。

有人可以告诉我错过了哪一点。

0 投票
1 回答
485 浏览

javascript - 在 Ace Editor 中突出显示单词

我正在使用 Ace Editor,特别是react-ace. 我想突出显示某个词。

我知道我可以定义自定义语法突出显示规则,但与每次输入更改时更新标记相比(在我的情况下不应该太频繁),这似乎比它的价值更麻烦。

对于标记,我需要Range单词的 - startRow, startCol, endRow, endCol。我尝试使用find()它,它似乎确实返回了我搜索的术语/正则表达式的所需范围,但这似乎是一个高级命令,它执行您对编辑器中“查找”操作的期望 - 亮点该术语并跳转到它。

我将如何Range在 Ace Editor 中检索一个单词?

0 投票
1 回答
40 浏览

ace-editor - 在 ace 编辑器中插入伪装文本

我正在使用 Ace Editor(在 React-Ace 中)允许在我的平台上插入编程片段。

我现在想要做的是有一个工作,但伪装,这样我就不会暴露一些内部信息。

例如我想追加$[internal_flow_vars\["0f912efd-a2ab-46be-b908-0a6201486a0d\"].passageCount]但我不想显示 uuid,我只想显示${passageCount}

文本看起来像(用户看到)

Hello its my ${passageCount} turn

但是生成的脚本需要是(机器看到)

Hello its my $[internal_flow_vars\["0f912efd-a2ab-46be-b908-0a6201486a0d\"].passageCount] turn

感谢您的时间