完成检查

完成以下操作后，你已经拥有一个可继续开发的宿主编辑器：

从物料栏拖入文本和公告，并在右侧修改属性。
修改页面标题和 surface 背景色。
保存草稿，重新加载后确认 Schema 与物料状态恢复。
切换到只读运行时，确认公告和容器区域按业务组件渲染。

贯穿示例的顶部操作实现了这条闭环：

vue

const repository = createMemoryPageRepository()
const revision = ref(0)
const status = ref('尚未保存')
const showPreview = ref(false)
const runtimeSchema = computed(() => schema.value as unknown as DesignerSchema)

async function saveDraft() {
  const page = await repository.save({
    id: pageId,
    revision: revision.value,
    schema: exportSchema(),
  })
  revision.value = page.revision
  status.value = `已保存版本 ${page.revision}`
}

async function reloadDraft() {
  const page = await repository.load(pageId)
  if (!page) {
    status.value = '还没有可加载的草稿'
    return
  }

  const result = designer.engine.importSchema(page.schema)
  if (!result.ok) {
    status.value = '草稿没有通过当前物料注册表校验'
    return
  }

  revision.value = page.revision
  status.value = `已加载版本 ${page.revision}`
}

onBeforeUnmount(() => designer.dispose())

这些结果不代表已经可以直接发布到生产。发布、审核、资源权限和生产运行时的跨端策略仍由业务应用定义。

接下来按你的目标进入高级自定义，或从 API 参考查找精确的公开类型。

完成检查 ​

完成检查