Closed wimmers closed 3 years ago
@wimmers Can you give an example of your project?
@jaywcjlove
This would be a small example:
import React, { Component } from 'react'
import MarkdownEditor from '@uiw/react-markdown-editor';
const testText = "This is a test. "
const longLine = `${testText}${testText}${testText}${testText}${testText}${testText}`
class App extends Component {
state = {
markdown: '# This is a H1 \n## This is a H2 \n###### This is a H6',
}
updateMarkdown = (editor) => {
var value = editor.getValue()
value = value + "\n" + longLine
this.setState({ ...this.state, markdown: value })
}
render() {
return (
<div>
<MarkdownEditor
value={this.state.markdown}
onBlur={this.updateMarkdown}
height={500}
/>
</div>
);
}
}
export default App;
@wimmers The broadband calculation comes from within codemirror
.
<MarkdownEditor
value={markdown}
onBlur={(editor) => {
let value = editor.getValue();
value = value + "\n" + longLine;
+ editor.setValue(value);
- setMarkdown(value);
}}
height={500}
/>
Thanks, that works for me!
I use
MarkdownEditor
like this:When
this.state.note
is changed (transitioning toundefined
and then to a new string value), the editor text and the preview are updated correctly but longer lines of the editor text will overlap with the preview.