如何将自定义按钮添加到 Summernote 工具栏

Question

还有其他人对此有疑问吗？我关注了文档，但按钮没有显示。它只是创建一个空的 div。控制台没有错误。

文档：https://summernote.org/deep-dive/#custom-button

JS

$(document).ready(function() {
    $('#summernote').summernote({
        toolbar: [
            ['mybutton', ['hello']]
        ],
        buttons: {
            hello: HelloButton
        }
    });

    var HelloButton = function (context) {
    var ui = $.summernote.ui;

    // create button
    var button = ui.button({
        contents: '<i class="fa fa-child"/> Hello',
        tooltip: 'hello',
        click: function () {
        // invoke insertText method with 'hello' on editor module.
        context.invoke('editor.insertText', 'hello');
        }
    });

        return button.render();   // return button as jquery object
    }   
});

渲染的 HTML

Answer 1

我想通了。所以我不得不把 HelloButton 函数放在 $(document).ready() 之外