Summernote富文本编辑器怎么自定义高度和配置

![](https://resource.maoshu.fun/storage/default/20241015/imageefba4de43a01308f0f482c9e72c56cffb48c643e.png?e=1775206371&token=Ov7mXAv_8azPtTTXXyhh0S5qpDFEhafGpHARTAg2:LMlXE4Vszca_CtvrERIXuI68L8A=)

其实非常简单，只需要加属性即可：

`data-summernote-options`
 
例如：修改高度

在对应的textarea里加属性

```js
data-summernote-options='{ "minHeight": 150}'
```

所有属性包括这些：
```js

minHeight: 250,
lang: 'zh-CN',
fontNames: [
    'Arial', 'Arial Black', 'Serif', 'Sans', 'Courier',
    'Courier New', 'Comic Sans MS', 'Helvetica', 'Impact', 'Lucida Grande',
    "Open Sans", "Hiragino Sans GB", "Microsoft YaHei",
    '微软雅黑', '宋体', '黑体', '仿宋', '楷体', '幼圆',
],
fontNamesIgnoreCheck: [
    "Open Sans", "Microsoft YaHei",
    '微软雅黑', '宋体', '黑体', '仿宋', '楷体', '幼圆'
],
toolbar: [
    ['style', ['style', 'undo', 'redo']],
    ['font', ['bold', 'underline', 'strikethrough', 'clear']],
    ['fontname', ['color', 'fontname', 'fontsize']],
    ['para', ['ul', 'ol', 'paragraph', 'height']],
    ['table', ['table', 'hr']],
    ['insert', ['link', 'picture', 'video']],
    ['select', ['image', 'attachment']],
    ['view', ['fullscreen', 'codeview', 'help']],
],
buttons: {
    image: imageButton,
    attachment: attachmentButton,
},
dialogsInBody: true,
followingToolbar: false,
callbacks: {
    onChange: function (contents) {
        $(this).val(contents);
        $(this).trigger('change');
    },
    onInit: function () {},
    onImageUpload: function (files) {
        var that = this;
        //依次上传图片
        for (var i = 0; i < files.length; i++) {
            Upload.api.send(files[i], function (data) {
                var url = Fast.api.cdnurl(data.url, true);
                $(that).summernote("insertImage", url, 'filename');
            });
        }
    }
}
```

铜牌 · 会员

解锁全部文章

全部课程8折购买

如果在b站充值了专属会员，可联系猫叔直接开通相同时间的此会员

¥50/年

金牌 · 会员

解锁全部文章

全部课程5折购买

微信一对一答疑

优先解决问题

¥1999/年