Как в Editor (из библиотеки tinymce-react) загрузить данные из API?

Создаю приложение на React с использованием библиотеки tinymce/tinymce-react.

Вот создание самого компонента

import React, { useEffect, useRef } from 'react'
import { Editor } from '@tinymce/tinymce-react';


const TinyComponent = ({text, item, setItem, ...props}) => {
    const editorRef = useRef(null);
  return (<div {...props}>
      <div className="label">{text}</div>
    <Editor apiKey="4f6xda5u2vvl39l0*******"
         onInit={(evt, editor) => editorRef.current = editor}
         initialValue=''
         init={{
           height: 500,
           menubar: false,
         }}
         onChange={()=>setItem(editorRef.current.getContent())}
       />
  </div>
  )
}
export default TinyComponent

компонент работает, все отлично. Но мне нужно в editor закидывать готовые данные из API, чтобы в дальнейшем их редактировать.

Первое что пришло мне в голову, это в Editor -> initialValue указать item

item - это данные из бд, которые мне нужно редактировать в editor.

Editor отображает данные из бд. Но при попытке изменения данных (т.е. когда стираю, печатаю буквы) курсор перекидывается в начало строки, и так постоянно (невозможно что-либо изменить).

Как закинуть данные из бд в editor, для дальнейшего редактирования?