Question

美好的一天；我的问题是 Ckeditor 上的错误：我有一个 Laravel 项目。已下载 Ckeditor 4.16 库。并将其添加到项目中。我正在尝试执行自动完成功能，根据文档，必须下载一些插件。我已经添加了以下插件：

自动完成
文本观察器
文字匹配

但是，当遵循文档 here 的示例时。我无法让自动完成工作，因为它在控制台上抛出以下错误： Error ckeditor 在 app.blade.php 文件中，我像这样调用 ckeditor：

<script src="{{asset('assets/vendor/ckeditor/ckeditor.js')}}"></script>
    <script>
       // CKEDITOR.replace('taskEditor');
       // CKEDITOR.replace('input-firm');
        CKEDITOR.replace('body',{
            filebrowserUploadUrl: 'ckeditor/ck_upload.php',
            filebrowserUploadMethod: 'form'.anchor,
        })
    </script>

Y en en mi vista donde debo mostrar los datos esta asi:

 @extends('layouts.app')
@section('content')
    <div class="form-group row">
                                        <label for="" class="col-sm-3 col-form-label">Cuerpo del email <span class="text-red">*</span></label>
                                        <div class="col-sm-12">
                                            <textarea type="text" class="form-control form-control-sm "
                                                id="body"
                                                >
                                                <strong>{{ auth()->user()->firm }}</strong>
                                            </textarea>
                                        </div>
                                    </div>

    @endsection
    <script>
       var config = {};
       // Called when the user types in the editor or moves the caret.
        // The range represents the caret position.
        function textTestCallback( range ) {
            // You do not want to autocomplete a non-empty selection.
            if ( !range.collapsed ) {
                return null;
            }
    
            // Use the text match plugin which does the tricky job of performing
            // a text search in the DOM. The matchCallback function should return
            // a matching fragment of the text.
            return CKEDITOR.plugins.textMatch.match( range, matchCallback );
        }
    
        // Returns the position of the matching text.
        // It matches a word starting from the '#' character
        // up to the caret position.
        function matchCallback( text, offset ) {
            // Get the text before the caret.
            var left = text.slice( 0, offset ),
                // Will look for a '#' character followed by a ticket number.
                match = left.match( /#\d*$/ );
    
            if ( !match ) {
                return null;
            }
            return { start: match.index, end: offset };
        }
    
        config.textTestCallback = textTestCallback;
    
        // The itemsArray variable is the example "database".
    var itemsArray = [
        // (...)
        { id: 1703, name: 'Mentions plugin', type: 'feature' },
        { id: 1751, name: 'Autocomplete plugin', type: 'feature' },
        { id: 1746, name: 'Emoji plugin', type: 'feature' },
        { id: 2062, name: 'Emoji list button', type: 'feature' }
        // (...)
    ];
    
    // Returns (through its callback) the suggestions for the current query.
    function dataCallback( matchInfo, callback ) {
        // Remove the '#' tag.
        var query = matchInfo.query.substring( 1 );
    
        // Simple search.
        // Filter the entire items array so only the items that start
        // with the query remain.
        var suggestions = itemsArray.filter( function( item ) {
            return String( item.id ).indexOf( query ) == 0;
        } );
    
        // Note: The callback function can also be executed asynchronously
        // so dataCallback can do an XHR request or use any other asynchronous API.
        callback( suggestions );
    }
    
    config.dataCallback = dataCallback;
    
    config.itemTemplate = '<li data-id="{id}" class="issue-{type}">#{id}: {name}</li>';
    //config.outputTemplate = '<a href="https://github.com/ckeditor/ckeditor4/issues/{id}">{name} (#{id})</a> ';
    config.throttle = 200;
    config.autocomplete_commitKeystrokes = [ 9, 13 ];
    
    new CKEDITOR.plugins.autocomplete( body, config );
    
    </script>

请如果有人可以帮助我或给我一个如何解决此错误的想法或有关如何使用 ckeditor 实现自动完成的示例。谢谢

未捕获的类型错误：无法读取未定义的属性“autocomplete_commitKeystrokes”

0 个答案: