【问题标题】:How to limit the content length of the text editor如何限制文本编辑器的内容长度
【发布时间】:2021-07-04 05:41:15
【问题描述】:

我正在使用 vue3 和 vue3-editor(https://www.npmjs.com/package/vue3-editor) 我认为我应该限制内容的长度,所以我所做的是1image

/**What i did */
      if (this.quill.getLength() > 50) {
        this.quill.deleteText(50, this.quill.getLength());
      }
/*/ 

我在 vue3-editor.common.js , vue3-editor.umd.js 处添加了这段代码

我什至不知道为什么相同的代码在两个文件中。

如何限制长度,或者vue3有其他简单的基本编辑器吗?

【问题讨论】:

    标签: editor text-editor vue-cli vuejs3


    【解决方案1】:

    您不想更改文件 vue3-editor.common.jsvue3-editor.umd.js,因为这些文件是 vue3-editor 的分发文件,每次更新此依赖项时都会被覆盖(通常 不要更改 @987654327 中的任何内容直接@!)

    好消息是您不需要这样做,因为 vue3-editor 组件(在内部使用 Quill.js)正在将 text-change 事件从 Quill 路由到您(请参阅 examples

    模板:

    <vue-editor ref="editor" v-model="content" @text-change="onTextChange" />
    

    脚本

    data() {
      return {
        content: '',
        limit: 50
      }
    },
    methods: {
      onTextChange() {
        const quill = this.$refs.editor.quill
        const len = quill.getLength()
        if (len > this.limit) {
          quill.deleteText(this.limit, len);
        }
      }
    }
    

    虽然在阅读issue 时,我认为这不是您想要的完美解决方案...

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2012-01-16
      • 1970-01-01
      • 1970-01-01
      • 2014-09-04
      相关资源
      最近更新 更多