vue-quill-editor富文本编辑器

Muninn 发布于2019-08-21 18:29 / 3360人阅读

摘要：在工作中肯定会遇到使用富文本编辑器的时候接下来我们就来一起学习一下注本项目是在的脚手架中搭建下载配置在中引入引入富文本工具在中使用创建文件在页面添加元素在项目中显示引入他你也可为他添加样式想要获取输入的内容你可以

在工作中肯定会遇到使用富文本编辑器的时候
接下来我们就来一起学习一下 vue-quill-editor

注: 本项目是在vue的脚手架中搭建 1.下载

npm install vue-quill-editor --save

2.配置 1)在main.js中引入

import vueQuillEditor from "vue-quill-editor" // 引入富文本工具

2)在main.js中使用

Vue.use(vueQuillEditor)

3.创建vue文件 1)在页面添加quill-editor元素

2) 在项目中显示, 引入他

  import vueQuillEditor from "./vueQuillEditor.vue"

components: {
      "v-vueQuillEditor": vueQuillEditor
    }

你也可为他添加css样式

4)想要获取输入的内容你可以绑定v-model 在加上个change时间

5) 在js中这样写

export default {
      data() {
        return{
            progs: ""
        }
      },
      methods: {
          ssss: function () {
            console.log(this.progs)
          }
      }
  }

5) 这已经就可以使用了简不简单 在使用的过程中我还遇到了图片上传的问题和汉化的问题稍后我会吧代码上传

GPU云服务器云服务器富文本编辑器富文本web编辑器富文本百度富文本

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/90507.html

基于 Vue 的移动端富文本编辑器 vue-quill-editor 实战

摘要：优秀的富文本编辑器有很多，比如，等，但并不是每个都能在移动端有很好的表现。是百度的老牌富文本编辑器，但界面有一股上世纪的感觉，官网最新的一条动态停留在。优秀的富文本编辑器有很多，比如：UEditor，wangEditor 等，但并不是每个都能在移动端有很好的表现。我们暂且不讨论移动端是否真的需要富文本，既然有这需求，就把它实现出来。失败的尝试正确的选择是成功的开始，开发之前肯定要做一些...

wing324 2019-05-27 17:41 评论0 收藏0
vue-quill-editor富文本编辑器

摘要：富文本编辑器自定义组件加粗斜体下划线删除线引用代码标题标题有序列表无序列表下标上标减少缩进增加缩进输入方向字体大小段落格式字体颜色背景色字体对齐 vue-quill-editor 富文本编辑器自定义组件 ...

qujian 2019-08-22 13:57 评论0 收藏0
记一次解决 quill（vue-quill-editor） 编辑器中莫名多出一行“<p>

摘要：问题必须得解决，否则就又要换编辑器了。该函数内有这么一行计算的实际高度，然后拿下一个兄弟元素的与进行比较，如果前者比后者大，则插入一个换行。希望有其他看法或者解决方案的朋友可以留言说一下问题描述：在使用 vue-quill-editor 富文本编辑器过程中，加载已有的富文本数据到编辑器，经常会出现编辑器中莫名其妙多出一段换行内容（一般出现在段落与其他内容之间，例如标题，引用，列表...

ccj659 2019-08-22 16:18 评论0 收藏0
vue-quill-editor自定义图片上传

摘要：我们通常都会使用富文本编辑器在后台编辑内容，开发当然也少不了，我们通过官网的链接可以找到一些资源，或者去上查找一些开源的编辑器。我们通常都会使用富文本编辑器在后台编辑内容，开发vue当然也少不了，我们通过vue官网的链接可以找到一些资源，或者去github上查找一些开源的编辑器。我使用的是vue-quill-editor，它的界面很简洁，功能也满足平时的编辑需要，不过于臃肿，但是它默...

oneasp 2019-08-20 17:26 评论0 收藏0