javascript - Summernote 将字母间距添加到工具栏
问题描述
我想在 Summernote 的 ToolBar 中添加功能。我想以微调器或editText的形式控制字母间距,但我不知道在哪里添加它。即使我尝试了其他插件,我也无法理解。
// toolbar
toolbar: [
['style', ['style']],
['font', ['bold', 'underline', 'clear']],
['fontname', ['fontname']],
['color', ['color']],
['fontSize', ['fontSize']],
['letterSpace', ['letterSpace']],
['para', ['ul', 'ol', 'paragraph']],
['table', ['table']],
['insert', ['link', 'picture', 'video']],
['view', ['fullscreen', 'codeview', 'help']]
]
this.fontName = this.wrapCommand(function (value) {
return _this.fontStyling('font-family', "\'" + value + "\'");
});
this.fontSize = this.wrapCommand(function (value) {
return _this.fontStyling('font-size', value + 'px');
});
this.letterSpace = this.wrapCommand(function (value) {
return _this.fontStyling('letter-spacing', value + 'px');
});
解决方案
在下面添加 button.fontSize
this.context.memo("button.letter", function() {
return n.ui.buttonGroup([n.button({
className: "dropdown-toggle",
contents: n.ui.dropdownButtonContents('<span class="note-current-letter"/>', n.options),
tooltip: "font letter",
data: {
toggle: "dropdown"
}
}), n.ui.dropdownCheck({
className: "dropdown-letter",
checkClassName: n.options.icons.menuCheck,
items: n.options.letters,
title: "font letter",
click: n.context.createInvokeHandlerAndUpdateState("editor.letter")
})]).render()
this.fontSize = this.wrapCommand (function (t) 在底部添加下面的代码
this.letter = this.wrapCommand(function(t) {
u.fontStyling("letter-spacing", t + "px")
});
分别在 toolvar 和 popover 上
['letter', ['letter']] 和字母:["8", "9", "10", "11", "12", "13", "14", "15", "16" 、“17”、“18”、“19”、“20”、“21”、“22”、“23”、“24”、“32”、“48”、“72”、“112”、“ 127", "254", "500"] 已添加 已解决。
推荐阅读
- javascript - 根据用户选择显示不同的形式
- python - Django 扩展 - Jupyter 不工作。Django:SynchronousOnlyOperation:您不能从异步上下文中调用它 - 使用线程或 sync_to_async
- php - 如何通过数据透视表获得多态一对多关系?
- api - 如何使用外部 web api 在 docker 中与 prometheus 通信
- flutter - 如何使 Enums 类飞镖的 toMap 和 fromMap 方法颤动?
- matrix - 将两个“估计”矩阵与给定矩阵进行比较
- flutter - 覆盖一个小部件颤动
- rust - 有条件地更新 Rust 中的函数参数
- mysql - MySQL聚合列作为一组不同的值
- c# - API 向移动设备提供图像