Vue Tinymce富文本组件自定义操作按钮

最新推荐文章于 2025-02-12 10:08:28 发布

我是唐赢

最新推荐文章于 2025-02-12 10:08:28 发布

阅读量1.3k

点赞数 26

分类专栏： vue.js vue 自定义组件文章标签： vue.js javascript 自定义组件

本文链接：https://blog.youkuaiyun.com/gdgztt/article/details/135282950

版权

vue.js 同时被 3 个专栏收录

64 篇文章

订阅专栏

vue

17 篇文章

订阅专栏

自定义组件

16 篇文章

订阅专栏

本文介绍如何在编辑器的初始化方法中添加自定义插件，通过setup方法为日记日期按钮设置功能，点击后在光标位置插入预设字符。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

想实现如下效果

首先在init方法中的增加一插件

增加一个setup方法

代码

          setup: function(editor) { 

            editor.ui.registry.addButton('testButton', {
              text: '日记日期',
              tooltip: '插入日记日期',
              onAction: () => editor.insertContent("123456")
            });

          },

操作效果，点击新增的【日记日期】按钮，就会在光标所在处插入相应的字符，具体什么字符可以根据业务需要修改，现在的123456只是一个示例。