如何在react TINYMCE中获取光标位置

在React中使用TINYMCE获取光标位置的方法如下：

首先，确保你已经在React项目中安装并引入了TINYMCE编辑器。
创建一个React组件，用于包裹TINYMCE编辑器，并设置一个ref来获取编辑器实例。例如：

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

const MyEditor = () => {
  const editorRef = useRef(null);

  const handleEditorChange = (content, editor) => {
    // 在这里处理编辑器内容变化的逻辑
  };

  const handleGetCursorPosition = () => {
    if (editorRef.current) {
      const editorInstance = editorRef.current.editor;
      const cursorPosition = editorInstance.selection.getRng();

      // 在这里处理获取光标位置的逻辑
      console.log(cursorPosition);
    }
  };

  return (
    <div>
      <Editor
        onEditorChange={handleEditorChange}
        ref={editorRef}
      />
      <button onClick={handleGetCursorPosition}>获取光标位置</button>
    </div>
  );
};

export default MyEditor;

在上述代码中，我们创建了一个MyEditor组件，其中包含一个Editor组件和一个按钮。通过ref将Editor组件的实例赋值给editorRef，以便后续获取光标位置。
在handleGetCursorPosition函数中，我们通过editorRef.current.editor获取到TINYMCE编辑器的实例，并使用selection.getRng()方法获取光标位置的范围对象。
最后，你可以根据需要在handleGetCursorPosition函数中处理获取到的光标位置数据。

这样，你就可以在React中使用TINYMCE编辑器，并获取光标位置了。请注意，以上代码仅为示例，你可能需要根据具体情况进行适当的修改和调整。