score:2

Accepted answer

const TextArea = React.forwardRef((props, ref) => {
  const {editorRef} = props;
  function handleChange(e) {
    //if e.target.value will be that of enter , bring focus to textarea of Editor.js
    if(editorRef.current){
      editorRef.current.focus();
    }
  }
  return (
    <div>
      <textarea ref={ref} onChange={handleChange} />
    </div>
  );
});

const Editor = React.forwardRef((props, ref) => {
  return (
    <div>
      <textarea ref={ref} />
    </div>
  );
});

const Content = () => {
  const textAreaRef = useRef();
  const EditorRef = useRef();

  return (
    <div>
      <TextArea ref={textAreaRef} editorRef={EditorRef}/>
      <Editor ref={EditorRef} textAreaRef={textAreaRef} />
    </div>
  );
};

Related Query

More Query from same tag