1.0.11 • Published 3 years ago
quill-react-editor v1.0.11
Nights Editor
一个好用的 QuillEditor 框架。Nice Editor
QuillEditor
props | type | |
---|---|---|
submitRef | RefObject | |
content | content | |
position | 'top'/'bottom' | |
toolbar | boolean | |
placeholder | boolean | |
maxPictureNum | string | |
maxLetter | number | |
uploadFile | (file: File) => Promise<string | void> |
setValue | (val: string) => void | |
getValue | (val: string) => void |
import { QuillEditor } from "quill-react-editor";
const [content, setContent] = useState<string>();
const submitRef = useRef<any>();
function Index() {
const [visible, setVisible] = useState(false);
async function uploadFile(file: File) {
if (file) {
console.log("file", file)
const url = 'https://tse3-mm.cn.bing.net/th/id/OIP-C.h3UCtqDkFOx_yX4npRjy7AHaEo?pid=ImgDet&rs=1'
return url
}
}
const publish = () => {
console.log('You have clicked button,the content is ',content)
}
return (
<div>
<QuillEditor
position="top"
setValue={(value: string) => setContent(value)}
submitRef={submitRef}
uploadFile={uploadFile}
maxLetter={500}
maxPictureNum={6}
placeholder={"请描述你遇到的问题"}
toolbar={false}
/>
<button
className={styles.publishBtn}
ref={submitRef}
onClick={publish}
>
发布
</button>
</div>
);
}