Estoy usando el editor de rebajas TinyMCE con React Hook Form dentro del proyecto de mecanografiado NextJS. TinyMCE funciona bien si lo estoy usando sin react-hook-form .
Tengo problemas al usarlo con react-hook-form . Puedo ver la salida de datos HTML de editorRef.current.getContent() . Pero la salida data es un objeto vacío.
¿Alguna idea de lo que podría estar mal aquí?
import { useRef } from 'react'; import { Editor } from '@tinymce/tinymce-react'; import { useForm } from 'react-hook-form'; export default function App() { const editorRef = useRef<any>(null); const { register, handleSubmit } = useForm(); const submitData = (data) => { if (editorRef.current) { console.log(editorRef.current.getContent()); } console.log(data); }; return ( <> <form onSubmit={handleSubmit(submitData)}> <Editor onInit={(evt, editor) => (editorRef.current = editor)} initialValue="" init={{ height: 500, menubar: false, plugins: [ 'advlist autolink lists link image charmap print preview anchor', 'searchreplace visualblocks code fullscreen', 'insertdatetime media table paste code help wordcount', ] }} /> <input type="submit" /> </form> </> ); }He tenido éxito al usar el envoltorio del controlador RHF (v7.25) en torno al editor tinyMCE (v5.10) si eso ayuda