获取功能组件 React 中实例的引用

Question

我正在尝试添加一个 onClick 模板，我正在使用 ckeditor 库，我想获取编辑器的实例，以便我可以将它传递给其他组件并使用它的方法。但我不知道该怎么做，已经搜索了一段时间，但我无法用正确的词表达出来。我正在使用功能组件。

let ckeditor;

      <CKEditorContext context={Context}>
        <CKEditor
          editor={ClassicEditor}
          data={props.state.wysiwygData}
          onChange={props.editorOnChangeHandler}
          ref={props.editorRef}
          onReady={(editor) => {
            // I want to Pass the 'editor' instance to ckReference variable
              ckReference = editor;
            // But when I do this kind of approach it becomes undefined when passed
          }}
        />
      </CKEditorContext>

提前谢谢你，上帝保佑

Answer 1

所以我终于得到了像这样使用 useRef() 挂钩的编辑器实例，现在可以传递给其他组件了。

let ckeditor = useRef(null);

     <CKEditorContext context={Context}>
        <CKEditor
          editor={ClassicEditor}
          data={props.state.wysiwygData}
          onChange={props.editorOnChangeHandler}
          ref={props.editorRef}
          onReady={(editor) => {
            ckeditor.current = editor;
          }}
        />
      </CKEditorContext>

获取功能组件 React 中实例的引用

Get reference of instance in functional component React

ckeditor

reactjs

react-functional-component