Tinymce React component 'Editor' cannot be used as a JSX component

Viewed 338

i am trying to use the React version on Tiny mce. I am a beginner with react.

When i add the component in mine i got this error at compilation :

'Editor' cannot be used as a JSX component.
  Its instance type 'Editor' is not a valid JSX element.
    The types returned by 'render()' are incompatible between these types.
      Type 'ReactElement<{ ref: RefObject<HTMLElement>; id: string; }, string | JSXElementConstructor<any>>' is not assignable to type 'ReactNode'.
        Property 'children' is missing in type 'ReactElement<{ ref: RefObject<HTMLElement>; id: string; }, string | JSXElementConstructor<any>>' but required in type 'ReactPortal'.

My code :

import React from "react";
import { Editor } from "@tinymce/tinymce-react";

const Dummy = () => <Editor apiKey={"hgt9dr50djqpx23dm6h18u9dsayv95elris5dxsqlrc0ht37"}
                            init={{...}}
                            onEditorChange={()=>null}/>


export default Dummy;

Thanks :)

1 Answers

I had a similar issue in the last few days. It seems to be related to a typescript update.

As a workaround, add the following on the line immediately above the error line.

{/* @ts-ignore*/}
<Editor ....

The tells the typescript checker to ignore the following line of code.

Parentheses needed because of react but the line is just a JS comment but typescript reads it.

Related