如何用Next.js实现诸如Quill或Draft.js之类的富文本编辑器？

npx create-next-app my-rich-text-editor

npm install quill

import React, { useRef, useEffect } from 'react';
import Quill from 'quill';

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

  useEffect(() => {
    const editor = new Quill(editorRef.current, {
      theme: 'snow',
      // 其他配置选项
    });

    // 可以在这里添加其他事件处理程序或自定义逻辑

    return () => {
      editor.destroy();
    };
  }, []);

  return <div ref={editorRef} />;
};

export default RichTextEditor;

import React from 'react';
import RichTextEditor from '../components/RichTextEditor';

const MyPage = () => {
  return (
    <div>
      <h1>My Page</h1>
      <RichTextEditor />
    </div>
  );
};

export default MyPage;