rich-text-editor 相关问题

富文本编辑器允许在Web浏览器中编辑，输入和格式化内容，其中包含与其最终外观接近的丰富标记和样式。

mdxeditor 是 Markdown 编辑器，我想与 React 和 tailwindcss 一起使用。具有以下文件结构：应用程序_mdxeditor ├── package.json ├── package-lock.json ├── 公共 │ └──index.html ├── 来源 │ ├──...

reactjs tailwind-css markdown wysiwyg rich-text-editor

回答 1 投票 0

为什么editable-div会将光标移动到div前面

<div className="min-w-[600px] min-h-[36.8px]" > <div id={`editableDiv-${Object.keys(item)}-${index}`} className="p-3" contentEditable suppressContentEditableWarning onInput={(e) => onChange(e)} > {Object.values(item)} </div> 使用上面的 editable-div 代码，当触发 onInput 时，索引不断移动到 div 的前面。例如。当我输入“fruit”时，它会变成“tiurf” <div className="min-w-[600px] min-h-[36.8px]" > <div id={`editableDiv-${Object.keys(item)}-${index}`} className="p-3" contentEditable suppressContentEditableWarning onInput={() => onChange} > {Object.values(item)} </div> 我之前使用过这段代码，它有效。但是，它停止触发 onInput。 const onChange = (e: any) => { console.log(1) let targetId = e.currentTarget.id let objectContent = e.currentTarget.textContent let checkIndex = parseInt(targetId.split('-')[2]) let checkTitle = targetId.split('-')[1] let newArr = [...content] newArr[checkIndex][checkTitle] = objectContent setContent(newArr) updateData(content) } 这是正在触发的 onChange 函数。当 onInput 未触发且未在使用状态的对象中进行管理时，它会照常工作。但是，当 div 的 onInput 被触发时，它开始将光标移动到前面。发生这种情况是因为每次我更改 editable-div 内的数据时，状态都会发生变化，并且页面会重新渲染，导致光标移动到前面。因此，不使用 useState，而是使用 useRef 不会重新渲染页面，从而提供连续的写入流程。附注任何重新渲染都会将光标移动到前面。

javascript html reactjs typescript rich-text-editor

回答 1 投票 0

如何为内联编辑器自定义 django TextField

我正在使用 Django 开发一个互联网论坛平台，并面临着自定义 TextField 的挑战，以支持内联编辑器，而无需第三方编辑器（例如 TinyMCE 或 CK）...

python django django-forms rich-text-editor django-widget

回答 1 投票 0

reactjs 中的富文本编辑器

如何在Reactjs中创建富文本编辑器并保存输入的值并在控制台中显示/以状态保存值并将其发送到php文件？我已尝试以下代码但无法保存v...

reactjs wysiwyg console.log rich-text-editor draftjs

回答 3 投票 0

如何从 Strapi 富文本字段创建目录

我到处都在寻找这个，但我只能找到一篇关于它的文章，内容相当模糊。因此，我使用 Strapi 本身的 BlocksRenderer 组件渲染富文本内容。是...