elementui上传图片加参数_Vue + Element UI使用富文本编辑器

第一步下载组件

npm install vue-quill-editor

第二步在需要使用的组件内引入· 富文本组件

import {quillEditor } from 'vue-quill-editor'

同时引入相关css

import 'quill/dist/quill.core.css'

import 'quill/dist/quill.snow.css'

import 'quill/dist/quill.bubble.css'

注册组件

components: {

quillEditor

}

基本配置

data () {

return {

content: '',

editorOption: {}

}

},

methods: {

submit () {

console.log(this.$refs.text.value)

}

}

// editorOption里是放图片上传配置参数用的，例如：

// action: '/api/product/richtext_img_upload.do', // 必填参数 图片上传地址

// methods: 'post', // 必填参数 图片上传方式

// token: '', // 可选参数 如果需要token验证，假设你的token有存放在sessionStorage

// name: 'upload_file', // 必填参数 文件的参数名

// size: 500, // 可选参数 图片大小，单位为Kb, 1M = 1024Kb

// accept: 'multipart/form-data, image/png, image/gif, image/jpeg, image/bmp, image/x-icon,image/jpg' // 可选 可上传的图片格式