ckeditor5 中的 ckfinder 反应 js 不工作
ckfinder in ckeditor5 react js not working
我通过从 ckeditor 站点复制代码来使用 ckeditor react 组件,当将 'ckfinder' 添加到工具栏时它 return 错误如下:
未捕获的类型错误:无法读取未定义的 属性 'modal'
这里是我的代码:
import React, { Component } from 'react';
import { CKEditor } from '@ckeditor/ckeditor5-react';
import ClassicEditor from '@ckeditor/ckeditor5-build-classic';
class App extends Component {
render() {
return (
<div className="App">
<h2>Using CKEditor 5 build in React</h2>
<CKEditor
editor={ ClassicEditor }
config={ {
toolbar: [ 'bold', 'italic' , 'ckfinder' ]
} }
data="<p>Hello from CKEditor 5!</p>"
onReady={ editor => {
// You can store the "editor" and use when it is needed.
console.log( 'Editor is ready to use!', editor );
} }
onChange={ ( event, editor ) => {
const data = editor.getData();
console.log( { event, editor, data } );
} }
onBlur={ ( event, editor ) => {
console.log( 'Blur.', editor );
} }
onFocus={ ( event, editor ) => {
console.log( 'Focus.', editor );
} }
/>
</div>
);
}
}
export default App;
从您发布的代码来看,不能说明太多。但是,基于不同的线程,问题似乎来自过时的包。
您可以按照以下步骤操作,看看是否能解决问题。
- npm install --save @ckeditor/ckeditor5-react @ckeditor/ckeditor5-build-decoupled-document(如果你安装了它,删除它并重新安装)
- 将您的代码粘贴到组件中。
- 将 src="https://ckeditor.com/apps/ckfinder/3.4.5/ckfinder.js" 添加到您的页面或根文件中 - 将其包装在脚本标签中!
- npm 启动
我通过从 ckeditor 站点复制代码来使用 ckeditor react 组件,当将 'ckfinder' 添加到工具栏时它 return 错误如下:
未捕获的类型错误:无法读取未定义的 属性 'modal'
这里是我的代码:
import React, { Component } from 'react';
import { CKEditor } from '@ckeditor/ckeditor5-react';
import ClassicEditor from '@ckeditor/ckeditor5-build-classic';
class App extends Component {
render() {
return (
<div className="App">
<h2>Using CKEditor 5 build in React</h2>
<CKEditor
editor={ ClassicEditor }
config={ {
toolbar: [ 'bold', 'italic' , 'ckfinder' ]
} }
data="<p>Hello from CKEditor 5!</p>"
onReady={ editor => {
// You can store the "editor" and use when it is needed.
console.log( 'Editor is ready to use!', editor );
} }
onChange={ ( event, editor ) => {
const data = editor.getData();
console.log( { event, editor, data } );
} }
onBlur={ ( event, editor ) => {
console.log( 'Blur.', editor );
} }
onFocus={ ( event, editor ) => {
console.log( 'Focus.', editor );
} }
/>
</div>
);
}
}
export default App;
从您发布的代码来看,不能说明太多。但是,基于不同的线程,问题似乎来自过时的包。
您可以按照以下步骤操作,看看是否能解决问题。
- npm install --save @ckeditor/ckeditor5-react @ckeditor/ckeditor5-build-decoupled-document(如果你安装了它,删除它并重新安装)
- 将您的代码粘贴到组件中。
- 将 src="https://ckeditor.com/apps/ckfinder/3.4.5/ckfinder.js" 添加到您的页面或根文件中 - 将其包装在脚本标签中!
- npm 启动