问题标签 [draftjs]

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 投票
3 回答
2693 浏览

javascript - 检查 DraftJS 中的 contentState 是否更改的最佳性能方法,或者只是 editorState

我试图让一个函数仅在 contentState 本身发生变化时运行,而不仅仅是 editorState。

我现在的想法是将旧的 contentState 存储为字符串并将其与新的 contentState 作为字符串进行比较,但是将状态转换为字符串并进行比较似乎非常浪费。有没有更好的办法?

0 投票
3 回答
7830 浏览

javascript - 如何在 Draft.js 中对齐文本

我想知道如何在Draft.js中对齐文本,如下图所示。

文本对齐

我已经搜索了几天,但我还没有找到解决方案。

0 投票
1 回答
4344 浏览

html - 如何用 html 替换 DraftJS 编辑器中存在的某些文本/块?

我正在使用 DraftJS 编辑器在我的应用程序的基于 React 的网页中具有富文本功能。

我有以下要求:

当用户键入 # 键时,编辑器旁边会显示一个下拉列表,用户可以从中选择一个选项。根据他的选择,我想用一些 HTML 替换 #,例如图像。

我已经创建了用于在用户在编辑器中输入 # 字符后立即显示下拉列表的逻辑,但不明白如何用其他一些 HTML/文本替换该哈希字符。

我已经用谷歌搜索了如何做到这一点,但到目前为止还没有找到一个这样的精确例子。

有人可以对此进行指导,举个例子更好吗?

注意:我知道有一些 DraftJS 插件提供了提及功能,但我不想使用这些,而只是想使用我上面提到的内容替换的东西继续我自己的逻辑。

0 投票
2 回答
5179 浏览

reactjs - 在 Draft.js 中制作要点

我正在使用 Draft.js 向我的 React 应用程序引入文本编辑器。我已经使它适用于粗体、斜体和下划线,但我不知道如何将文本更改为项目符号。我已阅读文档,但找不到任何有用的信息。有人可以帮忙吗?

0 投票
1 回答
1838 浏览

javascript - 在 DraftJS 中设置自定义类型

我很好奇我们是否可以定义自己的块类型而不是使用DRAFTBLOCKTYPE中的一个。

目前我正在玩使用名为draft-image-plugin 的插件的draft-wysiwyg。问题是我必须传递块的类型而不是使插件工作。block-imageatomic

实际上,我曾尝试使用此解决方案,插件的类型覆盖为atomic. 但它会影响应用程序上其他atomic类型的块,在这些块中我无法创建自己的 blockRendererFn,因为 blockRenderer 被该插件的 blockRenderer“吞噬”。

要将块类型设置为atomic,我可以通过以下方式轻松实现:

如何将块类型设置为任何自定义类型,例如block-imageor block-table?这甚至可能吗?

0 投票
1 回答
7270 浏览

reactjs - 在不移动选择的情况下将空块添加到 Draft.js

在不更改 SelectionState 的情况下,将空的无样式块添加到 Draft.js 编辑器的最佳方法是什么?

0 投票
1 回答
10581 浏览

javascript - React & Draft.js - convertFromRaw 不工作

我正在使用 Draft.js 来实现文本编辑器。我想将编辑器的内容保存到数据库中,然后检索它并再次将其注入编辑器,例如在重新访问编辑器页面时。

首先,这些是相关的进口

我如何将数据保存到数据库(位于父组件中)

现在,当我检查数据库时,我得到以下对象:

到目前为止一切顺利,我想,我尝试了一些其他的东西,并且数据库中的对象肯定被转换了。例如,当我在不调用 convertToRaw() 方法的情况下保存内容时,会有更多字段。

将数据设置为新的 EditorState

为了从数据库中检索数据并将其设置为 EditorState,我也尝试了很多。以下是我的最佳猜测:

渲染组件时出现以下错误:

任何帮助是极大的赞赏!

0 投票
1 回答
1358 浏览

javascript - 突出显示带有注释的选择,悬停时显示且可编辑

我尝试使用 draft.js 来实现具有一些功能的文本编辑器来更正文本。这个想法是突出一个错误,并写一些注释来纠正它。将鼠标悬停在突出显示的文本上,注释应显示并可编辑。

我已经编写了一些内联样式来突出显示文本,但是内联样式只能用跨度(或另一个)包装一些文本并赋予它一些样式(https://facebook.github.io/draft-js/docs/advanced -topics-inline-styles.html#content

但是,我需要处理 onmouseover / onmouseleave 事件以显示注释并最终对其进行编辑。

我可以用块或其他东西包装选择吗?该块将是另一个块内的跨度,例如内联样式...

0 投票
1 回答
4756 浏览

reactjs - 如何在 Draft.js 中实现链接?

官方链接示例已损坏(没有 contentState 传递给 findLinkEntities 函数)。是否有任何其他通过 draft.js 实现的链接?

0 投票
1 回答
3487 浏览

javascript - DraftJS Uncaught TypeError:无法读取未定义的属性“块”

我正在尝试从数据库中读取数据,然后通过反应渲染到 DOM。对于输入,我使用了 draft.js 并在保存到数据库之前对其运行 convertToRaw。但是,当我运行 convertFromRaw 并渲染时,我在控制台中收到此错误:“Uncaught TypeError: Cannot read property 'blocks' of undefined”。这是我第一次使用 Draft.js,所以我不确定我做错了什么。有人可以帮忙吗?太感谢了!