hxy-editor

pd-editor

基于 UniverJS 的 Vue 3 编辑器组件库，提供电子表格（<pd-excel>）和文档（<pd-doc>）编辑能力。

安装

npm install hxy-editor

引入

全局注册（推荐）

import { createApp } from 'vue'
import pd from 'hxy-editor'

const app = createApp(App)
app.use(pd)

注册后可在任意组件中使用 <pd-doc> 和 <pd-excel>。

按需引入

import { PdDoc, PdExcel } from 'hxy-editor'

组件 API

<pd-doc> — 文档编辑器

<template>
  <pd-doc ref="editorRef" type="edit" />
</template>

Props

Exposes（通过 ref 调用）

<pd-excel> — 电子表格编辑器

<template>
  <pd-excel ref="sheetRef" type="edit" />
</template>

Props

Exposes（通过 ref 调用）

使用示例

<template>
  <pd-doc ref="editorRef" type="edit" />
  <button @click="save">保存</button>
</template>

<script setup>
import { ref } from 'vue'

const editorRef = ref(null)

function save() {
  const data = editorRef.value?.getData()
  console.log('文档数据：', data)
}
</script>

技术栈

• Vue 3.4+
• Univer 0.25.1
• Vite 8（构建）

License

MIT