- 如何在项目中安装
安装依赖npm install vditor --save
在代码中引入并初始化对象
import Vditor from 'vditor'
import "~vditor/src/assets/scss/index"
const vditor = new Vditor(id, {options...})
- 创建一个编辑器
<div id="vditor"></div>
mounted() {
this.contentEditor = new Vditor('vditor', {
cache: {
enable: false
},
after: () => {
this.contentEditor.disabled(true);
},
});
},
- 常见API
| 说明 |
|---|
| after | 编辑器异步渲染完成后的回调方法 | | height | 编辑器总高度 | | placeholder | 输入区域为空时的提示 | | input(value: string) | 输入后触发 | | focus(value: string) | 聚焦后触发 | | blur(value: string) | 失焦后触发 | | esc(value: string) | esc 按下后触发 | | select(value: string) | 编辑器中选中文字后触发 | | value | 编辑器初始化值 | | enable | 是否使用 localStorage 进行缓存 |
- 编辑器如何设置只读
相关 API： disabled()
this.contentEditor = new Vditor('vditor', {
after: () => {
this.contentEditor.disabled(true);
},
});
|