vue-quill-editor 解决空格不回显以及插入之后的图片可以调整大小的问题
解决富文本空格不显示的bug超级简单//加上 class="ql-editor"这个class即可<quillEditor class="ql-editor"v-model="ruleForm.gg"ref="myQuillEditorGg"...
·
解决富文本空格不显示的bug超级简单
//加上 class="ql-editor"这个class即可
<quillEditor class="ql-editor"
v-model="ruleForm.gg"
ref="myQuillEditorGg"
:options="editorOption3"
@blur="onEditorBlur($event)"
@focus="onEditorFocus($event)"
@change="onEditorChange($event)">
</quillEditor>
editor可以调整图片大小
引入
import { quillEditor } from 'vue-quill-editor'
import 'quill/dist/quill.core.css'
import 'quill/dist/quill.snow.css'
import 'quill/dist/quill.bubble.css'
import { toolbarOptions } from '@/utils/common.js'
import * as Quill from 'quill' // 引入编辑器
import ImageResize from 'quill-image-resize-module'
Quill.register('modules/imageResize', ImageResize)
data定义
data () {
return {
editorOption3: {
placeholder: '',
theme: 'snow', // or 'bubble'
modules: {
imageResize: {}, // 图片调整大小的关键这在这里可以 其他的参数因人而异,
}
}
}
}
做好了这些还不够,还得在 webpack.base.conf.js文件里面加入一段代码
var webpack = require('webpack') // 顶部引入
//在module.exports 内增加这一句话
plugins: [
new webpack.ProvidePlugin({
'window.Quill': 'quill'
})
],
更多推荐
已为社区贡献3条内容
所有评论(0)