Skip to content

集成 Props

除 preset / features 外,以下 props 用于宿主集成,通常不触发 session 重建(getter 动态读取)。

上传

vue
<YanivEditor
  :upload-image="async (file) => (await upload(file)).url"
  :upload-video="async (file) => (await upload(file)).url"
/>

未传时回退 DataURL。

图库

vue
<YanivEditor :gallery-images="images" />

模板与图库

模板

vue
<YanivEditor :custom-templates="templates" />

AI 托管

vue
<YanivEditor
  preset="full"
  :features="{ ai: true }"
  :ai-config="{
    provider: 'openai',
    apiKey: process.env.OPENAI_KEY,
    model: 'gpt-4o-mini',
    storageMode: 'memory',
    showSettings: false,
  }"
/>

AI 配置 API

大纲初始展开

outline 能力开启时,面板默认收起。需要初始展开时:

vue
<YanivEditor preset="full" :default-outline-expanded="true" />

该 prop 不触发 session rebuild。详见 大纲目录

Z-Index

编辑器浮层默认基准为 1000,通过 zIndexBase prop 配置(YanivEditor / YanivInlineEditor 均支持;映射为 .yaniv-editor 上的 --ye-z-base)。宿主页面有高层级 UI 时可提高:

vue
<YanivEditor :z-index-base="1500" />

浮层统一挂载在编辑器内部的 overlay portal.yaniv-editor__overlay-portal),不挂 document.body

完整 token 表、宿主层级协商与自定义 Shell 要求见 Z-Index 与浮层挂载

受控内容

vue
<YanivEditor :initial-content="doc" @update="doc = $event" />

Full Editor 内容协议为 JSONJSONContent)。Inline 为 HTMLv-model:content)。

受控回写带签名去重,避免 emit 回流导致光标跳动。preview 模式下 ContentAdapter 仍可通过 raw transaction 写入;JSON 写入前会按当前 schema 清洗未知节点/mark。

Expose

ts
const editorRef = ref<InstanceType<typeof YanivEditor>>();

editorRef.value?.getEditor(); // Tiptap Editor | null
editorRef.value?.getJSON();
editorRef.value?.getHTML();
editorRef.value?.getText();

高级运行时

自定义 shell 可使用:

ts
import {
  resolveEditorProfile,
  buildExtensions,
  CAPABILITIES,
  ContentAdapter,
  applyPhaseTransition,
} from "@yanivjs/yaniv-editor";

Composables API架构设计