react-monaco-editor
react-monaco-editor copied to clipboard
All content in editor is automatically selected
Describe the bug All content in the editor is automatically selected after changing the value.
To Reproduce This is my code
import { useEffect, useState } from 'react';
import MonacoEditor from 'react-monaco-editor';
export default function IndexPage() {
const [ value, setValue ] = useState('')
useEffect(() => {
setTimeout(() => {
setValue(`create table if not exists hudi_cow (
_hoodie_commit_time string,
_hoodie_commit_seqno string,
_hoodie_record_key string,
) using hudi
tblproperties (
'totalSize'='866815',
'last_commit_time_sync'='20230614194950434',
'last_commit_completion_time_sync'='20230614194958496',
)`)
}, 1000)
}, [])
return (
<div style={{ height: 300, width: 800, margin: 30, border: "1px solid #DDD" }}>
<MonacoEditor
value={value}
language='sql'
/>
</div>
);
}
setTimeout in code is used to simulate the backend interface.
Note that if the initial value is not an empty string, this bug will not occur, such as
const [ value, setValue ] = useState(' ')
Expected behavior I hope that the auto-selected one does not appear.
Tips This bug may be related to this issue of monaco-editor.
- [ ] I will try to send a pull request to fix this issue.