插件名称 | vue-document-editor |
---|---|
版本号 | v1.2.5 |
发布时间 | 2021年3月5日 |
插件作者 | motla |
基于Vue.js和contenteditable元素的功能丰富的纸张大小的WYSIWYG RTF编辑器。
# NPM
$ npm i vue-document-editor
1.导入并注册编辑器。
import VueDocumentEditor from 'vue-document-editor'
export default {
components: { VueDocumentEditor }
}
2.将文档编辑器添加到您的应用程序。
<template>
<div>
<vue-document-editor :content.sync="content" />
</div>
</template>
export default {
components: { VueDocumentEditor },
data () {
return {
content: ["<h1>Default Content</h1>"]
}
}
}
3.可用的道具来自定义编辑器。
// This contains the initial content of the document that can be synced
// It must be an Array: each array item is a new set of pages containing the
// item (string or component). You can see that as predefined page breaks.
// See the Demo.vue file for a good usage example.
content: {
type: Array,
required: true
},
// Display mode of the pages
display: {
type: String,
default: "grid" // ["grid", "horizontal", "vertical"]
},
// Sets whether document text can be modified
editable: {
type: Boolean,
default: true
},
// Overlay function returning page headers and footers in HTML
overlay: Function,
// Pages format in mm (should be an array containing [width, height])
page_format_mm: {
type: Array,
default: () => [210, 297]
},
// Page margins in CSS
page_margins: {
type: String,
default: "10mm 15mm"
},
// Display zoom. Only acts on the screen display
zoom: {
type: Number,
default: 1.0
}
v1.2.5 (07/03/2021)
v1.2.4(03/17/2021)
v1.2.3(03/09/2021)
<div>
从同步文档内容中删除无用的环境 executeCommand
功能后未触发修复内容更新 v1.2.2(03/08/2021)
v1.2.1(03/07/2021)