ProseMirror 能做什么、以及如何实现的示例
Examples of what ProseMirror can do, and how to do it
-
基础
使用示例配置搭建一个最小的富文本编辑器。
Setting up a minimal rich text editor using the example configuration.
-
文档中的恐龙
定义一个自定义文档节点类型,并把它添加到 schema 中。
Defining a custom document node type and adding it to a schema.
-
友好的 Markdown
让用户能在 Markdown 与所见即所得(WYSIWYM)编辑界面之间切换。
Allow users to switch between a Markdown and WYSIWYM editing interface.
-
Tooltip
使用 plugin view 实现一个悬浮在编辑器选区上的动态提示框。
Using a plugin view to implement a dynamic tooltip that hovers over the editor selection.
-
图片上传
通过在上传期间创建占位符,稳健地处理异步编辑操作。
Handling asynchronous editing actions robustly by creating a placeholder during uploads.
-
从零开始定义 Schema
不使用基础 schema,为几种不同的文档风格编写自定义文档 schema。
Writing custom document schemas for a few different document styles, without using a base schema.
-
编写你自己的菜单
构建一个自定义的编辑器菜单栏。
Building a custom editor menu bar.
-
可折叠节点
使用 node views 和 decorations 实现可折叠的节点。
Using node views and decorations to implement collapsible nodes.
更高级的示例
More advanced examples
-
嵌入代码编辑器
在 ProseMirror 实例内部使用代码编辑器组件来表示代码块。
Representing code blocks using a code editor component inside a ProseMirror instance.
-
Linter
一个扫描文档中常见错误并协助用户纠正的编辑器。
An editor that scans the document for common errors and assists the user in correcting them.
-
编辑脚注
把脚注实现为带内容的行内节点,并为子文档接上独立的编辑器。
Implementing footnotes as inline nodes with content, and wiring up a separate editor for a sub-document.
-
追踪变更
保存文档变更的历史,让用户能够查看和撤销单个变更。
Keeping a history of changes to the document, allowing the user to inspect and revert individual ones.
-
协同编辑
一个还算健壮的协同编辑器,支持共享批注。
A more or less solid collaborative editor, with support for shared annotations.