Laravel 6如何使用CKEditor 5？

Question

我可以使用CKEditor 4，但我根本无法使用CKEditor 5。我尝试通过从 /node_modules 下载或使用 CDN 来使用。我试过像使用 CKEditor 4 一样使用它，但它不起作用。

<script src="https://cdn.ckeditor.com/ckeditor5/12.4.0/classic/ckeditor.js"></script>
<script>
    CKEDITOR.replace('classic-ckeditor5')
</script>

我尝试将它加载到我的 create.blade.php.

@extends('layouts.app')

@section('content')
    <h1>Create Post</h1>
    {!! Form::open(['action' => 'PostsController@store', 'method' => 'POST']) !!}
    <div class="form-group">
        {{ Form::label('title', 'Title') }}
        {{ Form::text('title', '', ['class' => 'form-control', 'placeholder' => 'Title']) }}
    </div>
    <div class="form-group">
        {{ Form::label('body', 'Body')}}
        {{ Form::textarea('body', '', ['id' => 'classic-ckeditor5', 
        'class' => 'form-control', 'placeholder' => 'Body Text']) }}
    </div>
    {{ Form::submit('Submit', ['class' => 'btn btn-primary']) }}
    <!-- when submit button clicked the data will get send to store in PostsController -->
    {!! Form::close() !!}
@endsection

但这也没有用。

Answer 1

CKEditor 5 改变了他们实例化插件的方式。

早些时候（CKEditor <= 4.*），它是：

CKEditor.replace('<name of the textarea box>')

现在在 CKeditor >= 5.* 中是：

ClassicEditor
    .create(document.querySelector(<id of the textarea field>))
    .catch(error => {
        console.error(error);
    });

您可以将 ClassicEditor 替换为您正在使用的任何类型的编辑器。

更多信息请查看this CKEditor page

Laravel 6如何使用CKEditor 5？

How to use CKEditor 5 in Laravel 6?

ckeditor

ckeditor5

laravel-6