Synap Editor 컴포넌트 생성
SynapEditorComponent.js
import { useEffect } from 'react';
import SynapEditor from '../editors/synapeditor/synapeditor.min';
import '../editors/synapeditor/synapeditor.min.css';
function SynapEditorComponent({ editorId }) {
useEffect(() => {
console.log();
const config = {
'editor.license': { }
};
const html = '';
const eventListener = {
initialized: () => {
console.log('에디터 초기화 완료');
}
};
new SynapEditor(editorId, config, html, eventListener);
}, [editorId]);
return (
<div id={editorId}></div>
);
}
생성한 컴포넌트 사용
App.js
import SynapEditorComponent from './components/SynapEditorComponent';
function App() {
return (
<>
<h2>Synap Editor</h2>
<SynapEditorComponent id="synapeditor" />
</>
);
}
export default App;