vue3-tinymce配置最大输入字数限制

Vue3-Tinymce是一个基于Vue.js的TinyMCE富文本编辑器插件封装，如果你想在TinyMCE中添加最大输入字数限制，可以按照以下步骤配置：

首先，在安装`vue3-tinymce`之后，你需要在你的组件中导入并初始化TinyMCE，同时设置配置选项。例如：

<template>
  <tinymce-editor :config="mceConfig" @input="onInput"></tinymce-editor>
</template>

<script>
import { tinymceEditor } from 'vue3-tinymce';

export default {
  components: {
    tinymceEditor,
  },
  data() {
    return {
      mceConfig: {
        // 其他基础配置...
        plugins: 'advlist autolink lists link image charmap print preview hr anchor pagebreak',
        // 添加maxWords配置项
        setup: function(editor) {
          editor.on('keyup', function(e) {
            const maxLength = 100; // 设置最大字数，这里是100个字符作为示例
            const currentLength = editor.getContent().length;
            if (currentLength > maxLength) {
              alert('输入超过了最大字数限制!');
              editor.setContent(editor.getContent().substring(0, maxLength)); // 清除超出部分的文字
            }
          });
        },
      },
    };
  },
  methods: {
    onInput(content) {
      console.log('用户输入的内容:', content);
    },
  },
};
</script>

在这个例子中，我们在`setup`函数里监听了`keyup`事件，当用户输入超过预设的最大字数时，会给出警告，并自动截断超出的部分。