当前位置: 首页 > news >正文

Vue Tinymce富文本组件自定义带下拉框的操作按钮

 想实现如下效果

首先在init方法中的props,toolbar属性增加一个自定义按钮

增加一个setup方法

代码

          setup: function(editor) { editor.ui.registry.addSplitButton('myDateButton', {text: '日期时间',onAction: (_) => editor.insertContent(getJsMonthDay(getNowDate()) + " " + getWeekday(getNowDate())),onItemAction: (buttonApi, value) => editor.insertContent(value),fetch: (callback) => {const items = [{type: 'choiceitem',text: '当天 月-日 周几',value: getJsMonthDay(getNowDate()) + " " + getWeekday(getNowDate())},{type: 'choiceitem',text: '本月 月-日 周几',value: getMonthAllDays()}];callback(items);}});}, 

操作效果,下拉【日期日期】按钮,选择某项菜单,就会在光标所在处插入相应的字符。如下

http://www.lryc.cn/news/269693.html

相关文章:

  • YOLOv5算法进阶改进(10)— 更换主干网络之MobileViTv3 | 轻量化Backbone
  • Java UDP
  • Halcon阈值处理的几种分割方法threshold/auto_threshold/binary_threshold/dyn_threshold
  • FB混合C语言编译
  • 【机器学习】深度学习概论(二)
  • 词法语法语义分析程序设计及实现,包含出错提示和错误恢复
  • Linux的capability深入分析
  • 【自然语言处理】类似GPT的模型
  • 【Unity】【FBX】如何将FBX模型导入Unity
  • 腾讯云标准型S5服务器4核8G配置优惠价格表
  • 学习笔记:R语言基础
  • 初识智慧城市
  • Zookeeper之手写一个分布式锁
  • 【音视频 ffmpeg 学习】 RTMP推流 mp4文件
  • 跨进程通信 macOS XPC 创建实例
  • Python圣诞树代码
  • flask之文件管理系统-项目 JRP上线啦!!! ---修订版,兼容Windows和Linux系统
  • 希尔排序:排序算法中的调优大师
  • LeetCode 1185. 一周中的第几天
  • 大数据学习(30)-Spark Shuffle
  • Linux部署ELK
  • Python 实现 PDF 到 Word 文档的高效转换(DOC、DOCX)
  • 【MYSQL】MYSQL 的学习教程(七)之 慢 SQL 优化思路
  • unity学习笔记----游戏练习0
  • ai概念:强人工智能介绍、迁移学习
  • go语言设计模式-单例模式
  • 超维空间S2无人机使用说明书——51、基础版——使用yolov8进行目标跟踪
  • Transformer(seq2seq、self-attention)学习笔记
  • 2023-12-29 服务器开发-centos部署ftp
  • 螺旋数字阵(100%用例)C卷 (JavaPythonNode.jsC语言C++)