Я пытаюсь использовать редактор ToastUI в моем приложении Node.js. Когда я использую приведенные примеры, это ошибки. Я предполагаю, что примеры используют javascript и не работают в js. Как я могу использовать это в моем. js коде?
var editor = new Editor({
el: document.querySelector('#editSection'),
initialEditType: 'markdown',
previewStyle: 'vertical',
height: '300px'
});
Этот блок дает мне: TypeError: options.el имеет значение null
Файл:
import React from 'react';
import Editor from 'tui-editor';
import debounce from '../helpers';
import BorderColorIcon from '@material-ui/icons/BorderColor';
import { withStyles } from '@material-ui/core/styles';
import styles from './styles';
var editor = new Editor({
el: document.querySelector('#editSection'),
initialEditType: 'markdown',
previewStyle: 'vertical',
height: '300px'
});
class EditorComponent extends React.Component{
constructor() {
super();
this.state = {
text: '',
title: '',
id: ''
};
}
componentDidMount = () => {
this.setState({
text: this.props.selectedNote.body,
title: this.props.selectedNote.title,
id: this.props.selectedNote.id
});
}
componentDidUpdate = () => {
if (this.props.selectedNote.id !== this.state.id){
this.setState({
text: this.props.selectedNote.body,
title: this.props.selectedNote.title,
id: this.props.selectedNote.id
});
}
}
render() {
const { classes } = this.props;
return (
<div className={classes.editorContainer}>
<BorderColorIcon className={classes.editIcon}></BorderColorIcon>
<input
className={classes.titleInput}
placeholder='Note title...'
value={this.state.title ? this.state.title : ''}
onChange={(e) => this.updateTitle(e.target.value)}>
</input>
<editor
defaultValue={this.state.text}
onChange={this.updateBody}/>
{/*
<ReactQuill
value={this.state.text}
onChange={this.updateBody}>
</ReactQuill>
*/}
</div>
);
}
updateBody = async(val) => {
await this.setState({ text: val });
this.update();
};
updateTitle = async (txt) => {
await this.setState({ title: txt })
this.update();
}
update = debounce(() => {
this.props.noteUpdate(this.state.id, {
title: this.state.title,
body: this.state.text
})
},1500);
}
export default withStyles(styles)(EditorComponent);
Заранее спасибо!