The KindEditor rich text editor is used in Vue

KindEditor is used in Vue

1. Plug-in installation

npm install kindeditor

2. Component introduction

import "kindeditor/themes/default/default.css";
import "kindeditor/kindeditor-all-min.js";
import "kindeditor/lang/zh-CN.js";
Copy the code

3. HTML to addtextareaInput box

<textarea
id="kind_editor"
v-model="content"
style="width: 100%; min-height: 600px"
/>
Copy the code

4. Initialize the

data(){ return { editor: null, content: "" } }, mounted(){ this.initEditor(); } methods: { initEditor(){ this.editor = window.KindEditor.create("#kind_editor"); }}Copy the code

5. Initialization parameter

The official documentation

6. To use