ElectronJS - 使用本地键盘快捷键在 Textarea 中制作粗体文本

Question

我正在尝试在 ElectronJS 中制作一个文本编辑器，作为我在 Electron 中的第一个应用程序。我按应有的方式获得了 Textarea 和快捷方式设置，但在按 CTRL+B 时，我无法使 textarea 中的选定文本变粗。我可以在正确的方向上使用一些帮助来完成这项工作。

到目前为止，我已经尝试使用 execCommand 切换粗体，但出现错误： 文档未定义

Main.js

menu.append(new MenuItem({
    label: 'Shortcuts',
    submenu: [{
        role: 'Bold',
        accelerator: process.platform === 'darwin' ? 'Cmd+B' : 'Ctrl+B',
        click: () => { 
            document.execCommand('bold');
        }
    }]
}))
Menu.setApplicationMenu(menu)

我也在 renderer.js 中尝试过，但效果不佳。

我做错了什么？

Answer 1

这实际上回答了问题：

来自 link 的内容：

如果您需要自定义文本区域，请使用具有 contenteditable 属性的另一个元素（如 DIV）重现其行为。

它更具可定制性，也是一种更现代的方法，textarea 仅适用于纯文本内容，不适用于丰富的内容。

<div id='fake_textarea' contenteditable></div>

可以使用 CSS 溢出属性重现滚动条。

你可以正常地在表单中使用这个假的文本区域，即：如果你必须通过 POST 方法提交它的内容，你可以这样做（with jQuery）：

<input type='hidden' id='fake_textarea_content' name='foobar' />

...

$('#your_form').submit(function()
{
  $('#fake_textarea_content').val($('#fake_textarea').html());
});

ElectronJS - 使用本地键盘快捷键在 Textarea 中制作粗体文本

ElectronJS - Make bold text in Teaxtarea with local keyboard shortcut

javascript

textarea

keyboard-shortcuts

electron