30 lines
815 B
TypeScript
Executable File
30 lines
815 B
TypeScript
Executable File
import React, { useEffect, useRef, useState } from "react";
|
|
import Quill from "quill";
|
|
import "quill/dist/quill.snow.css"; // 引入默认样式
|
|
interface CollapsibleContentProps {
|
|
content: string;
|
|
maxHeight?: number;
|
|
}
|
|
|
|
const CollapsibleContent: React.FC<CollapsibleContentProps> = ({ content }) => {
|
|
const contentWrapperRef = useRef(null);
|
|
return (
|
|
<div className=" text-base ">
|
|
<div className=" flex flex-col gap-4 transition-all duration-300 ease-in-out rounded-xl p-6 ">
|
|
{/* 包装整个内容区域的容器 */}
|
|
<div ref={contentWrapperRef}>
|
|
{/* 内容区域 */}
|
|
<div
|
|
className="ql-editor p-0 space-y-1 leading-relaxed"
|
|
dangerouslySetInnerHTML={{
|
|
__html: content || "",
|
|
}}
|
|
/>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
);
|
|
};
|
|
|
|
export default CollapsibleContent;
|