Summernote-订单列表和无订单列表不起作用

问题描述

我在laravel上使用summernote软件包,但问题是Orderlist和unorder list在那儿不起作用。这是我要使用的代码。请帮助我解决此问题。

HTML:

<textarea data-feature="all"  class="summernote" data-height="250" name="editor"></textarea>

版本:

"summernote": "^0.8.18",

Summernote.js:

import summernote from '../../node_modules/summernote/dist/summernote-lite.js'
import summernoteCss from '../../node_modules/summernote/dist/summernote-lite.css'

(function($) { 
    "use strict";
        
    // Summernote
    $('.summernote').each(function() {
        let options = {
            placeholder: 'Hello stand alone ui',tabsize: 2,height: 120,toolbar: [
            ['style',['style']],['font',['bold','underline','italic']],['color',['color']],['para',['ul','ol','paragraph']],['table',['table']],['insert',['link','picture','video']],['view',['fullscreen','codeview','help']]
            ]
        }

        if ($(this).data('feature') == 'basic') {
            options.toolbar = [
                ['font','italic']]
            ]
        }

        if ($(this).data('feature') == 'all') {
            options.toolbar = [
                ['style',['style','bold','italic','clear']],['strikethrough','superscript','subscript']],['fontname',['fontname']],['fontsize',['fontsize']],'help']]
            ]
        }

        if ($(this).data('height') !== undefined) {
            options.height = $(this).data('height')
        }

        $(this).summernote(options)
    })
})($)

解决方法

我认为您需要为列表覆盖 css

/* For summernote override unordered and order list */
.note-editable ul{
  list-style: disc !important;
  list-style-position: inside !important;
}

.note-editable ol {
  list-style: decimal !important;
  list-style-position: inside !important;
}