问题标签 [tiptap]

我在我的项目中集成了一个调用的 Vue.js 扩展tiptap-vuetify。但是，当内容被注入到tiptap 编辑器中时，它会自动从HTML 中去除所有类和内联样式，然后再将其显示在内容编辑器中。

给定以下示例：

注入编辑器的内容由两个段落元素组成：

但是，当内容在tiptap 编辑器中显示时，class&style属性都会从html 呈现中剥离：

当它显示在编辑器中时，如何防止tiptap编辑器从内容中剥离样式和类属性？

我需要一些帮助来实现实时协作服务器（https://tiptap.dev/suggestions）中的提及。我的代码是这个的修改版本：https ://glitch.com/edit/#!/tiptap-sockets?path=server.js%3A1%3A0

我将这些步骤发送到我的套接字服务器以应用于文档的先前版本

并使用此模式来验证提及：

当我输入@Philip Isik 时，前端会发送以下步骤，

第 1 步：@philip Isik

第2步： ” ”

这些是服务器接收到的 JSON 格式的上述步骤：

在第 1 步之后，循环失败并抛出

RangeError：位置 15 超出范围

所以我在第一步之后检查了内容长度，它说它的长度是 3，而它应该是长度 12（@Philip Isik 的长度）

有谁知道为什么会这样？已经在这 2 天了。任何帮助是极大的赞赏！

TLDR：

1. 所以我要向服务器发送一个@Name 以应用于当前版本的文档。

2. 服务器接收到提到的步骤@Name

3. 现在，当它发送下一步时，发送的步骤是位置 6（@Name 的长度为 5，因此 5+1th=6th pos）

4. 这就是问题所在，根据tiptap/prose对象，@Name的长度是2，而不是5

5. 因此，它会引发“位置超出范围错误”

TipTap编辑器及其后代quasar-tiptap可以在浏览器中以 HTML 和 JSON 格式导出用户创建的内容。如果我计划允许用户数据往返于我的服务器，那么使用这两种格式进行存储的优缺点是什么。

我会假设 HTML 更容易受到 XSS 攻击，而且过去确实已经发现（并纠正了）这样的漏洞。如果需要，使用 JSON 进行后端解析会更容易。

除此之外，使用这两种格式有什么主要好处吗？保持用户输入的保真度很重要。大小很重要（图像存储有什么不同吗？）。编辑器性能很重要。脚本攻击漏洞极为重要。

选择哪个？

我的项目 JS 大约 680 kb。我添加了 vuetify-tiptap 编辑器，现在 JS 为 1338 kb。

我在https://www.npmjs.com/package/tiptap-vuetify#installation中加载这样的插件

在vuetify.js：

然后我在组件中使用tiptap ( Editor.vue)

JS：

有没有办法只在需要时加载所有内容或减少 chunk-vendors.js？

我正在使用 Tiptap 编辑器编写内容，然后通过v-html指令附加由它生成的数据。

我知道 v-html 可以处理具有绝对来源的图像，例如“https://something/file.jpg”，但我需要一个通过 Webpack 并在其名称中获取哈希的图像。并且要求图像似乎不适用于 v-html。有人解决了这样的问题吗？

upd 代码如下：

someData 作为对异步请求的响应，它看起来像这样：

这是文本编辑器的标准输出。为了不使用标签显示它，我将它传递给v-html. 问题是如何处理通过 webpack 的图像。我没有头绪。

我在一个接收字符串作为输入的函数中：

我可以通过 Vue 道具 ( ) 访问编辑器props.editor。我想用这个文本替换当前节点的内容。我似乎无法找到如何做到这一点。我正在使用tiptap2，它是 ProseMirror 的包装器，可以访问所有 ProseMirror 的 api。

除非必要，否则我宁愿不尝试替换整个节点，我也尝试过，在下面做 - 但也不能让它工作：

非常感谢

我正在构建一个简单的富文本编辑器来编写博客。我想强制第一个节点始终是h1用户不应该删除的标题（标签）！

有没有办法做到这一点？

我正在我的 Angular 11 应用程序中构建一个 Tiptap 2.0 编辑器。

在这个编辑器中，我想对一堆节点进行分组/嵌套。如何将节点添加为兄弟节点，即作为父容器/节点的子节点？

感谢所有帮助！

我正在使用提示编辑器，但在访问编辑器的内容时​​遇到了一些问题。我需要将编辑器的内容发布到 API，所以我需要内容。这是我的代码：

在父组件中，我有一些属性需要传递给tiptap编辑器

我无法访问编辑器内容。我已经尝试过这个解决方案https://github.com/ueberdosis/tiptap/issues/133但我在输入时不断出错。

错误：“getHTML 不是函数”

此代码有效但绝对无效（未创建节点）

此代码引发错误

需要放置节点时出错

<button @click="editor.chain().focus().togglePage().run()" :class="{ 'is-active': editor.isActive('PageNode') }"> 切换页面

也许我丢失了重要参数？

我以检查 TableCell 节点为例，工作正常，但我未能在我的代码中执行相同的功能