1.3 KiB
1.3 KiB
ArticleEditor 文章编辑器
以 Article 为数据模型，按正文类型切换纯文本、Markdown 与富文本三种编辑形态。
基础用法
:::preview 基础用法 || 切换正文类型会同时替换内容，提交时读取完整文章
demo-preview=../demos/article-editor/basic.vue
:::
何时使用
需要在一套表单里同时支持多种正文格式时使用。切换只改 contentType，上层不需要关心具体编辑器。
数据模型
组件只约束三个字段，其他字段会原样保留：
| 字段 | 说明 |
|---|---|
contentType |
正文类型，支持 TEXT、MARKDOWN、TIP_TAP（TIPTAP 为兼容写法）。 |
content |
正文内容，随类型分别是纯文本、Markdown 源码或 HTML。 |
attachmentList |
附件列表，元素至少包含 id、name、url。 |
附件与媒体
uploadImage、uploadVideo 负责上传，resolveAttachmentUrl、resolveTempUrl 负责把附件标识换成可访问地址。四个回调都可选，不传时对应能力自动降级。
提交内容
编辑过程中抛出的是实时值，提交时建议调用 submit()，它会等待富文本里未完成的上传再返回最终数据：
const article = await editorRef.value?.submit();