Teach you two minutes to use the rich text editor quill-editor in Vue

1. What is a rich text editor?

Rich Text Editor, Rich Text Editor, or RTE for short, is a WYSIWYG text editor that can be embedded in the browser.

Two, configure in Vue

1. Download Vue-Quill-Editor

npm install vue-quill-editor --save

2. Download quill (Vue-Quill-Editor needs to be dependent)

npm install quill --save

3. How to use

<template>
  <div>
      <!-- 富文本编辑器 -->
      <div class="box">
      <quill-editor></quill-editor></div>
  </div>
</template>

<script>
import {
    
     quillEditor } from "vue-quill-editor"; //调用编辑器
import 'quill/dist/quill.core.css';
import 'quill/dist/quill.snow.css';
import 'quill/dist/quill.bubble.css';
export default {
    
    
     components:{
    
    
      
      quillEditor 
    },
}
</script>

<style lang="scss" scoped>
.box{
    
    
  width: 500px;
  height: 300px;
}

</style>

Fourth, the demonstration effect

Welcome to join the group for technical discussions, group number: 954314851