富文本编辑器的使用

阅读 160

2022-03-11

1、安装

npm install vue-word-editor --save 

依赖 quill,axios,vue

2、引入

<script>
import VueEditor from "vue-word-editor";
import "quill/dist/quill.snow.css"

3、注册组件

components: {
  VueEditor
},

4、视频和图片的配置

data(){
  return {
    config: {
      // 上传图片的配置
      uploadImage: {
        url: "http://localhost:3000/upload",
        name: "file",
        // res是结果,insert方法会把内容注入到编辑器中,res.data.url是资源地址
        uploadSuccess(res, insert){
          insert("http://localhost:3000" + res.data.url)
        }
      },
  	 
      // 上传视频的配置
      uploadVideo: {
        url: "http://localhost:3000/upload",
        name: "file",
        uploadSuccess(res, insert){
          insert("http://localhost:3000" + res.data.url)
        }
      }
    }
  }
},

精彩评论(0)

0 0 举报