Closed ianfelix closed 1 year ago
import React, { useEffect, useState } from "react";
import ReactDOM from "react-dom";
import MDEditor from "@uiw/react-md-editor";
const mkdStr = `# Markdown Editor`;
function App() {
const [textarea, setTextarea] = useState();
const [value, setValue] = React.useState(mkdStr);
useEffect(() => {
console.log("$edit:12", textarea);
}, [textarea]);
function refCallback(node) {
if (node && node.textarea) {
setTextarea(node.textarea);
}
}
return (
<div className="container">
<h3>Auto</h3>
<MDEditor
ref={refCallback}
height={200}
value={value}
onChange={setValue}
/>
</div>
);
}
It seems that on typescript project doesn't recognize the ref prop
@ianfelix Upgrade v3.23.3
@ianfelix https://codesandbox.io/embed/misty-waterfall-485be5?fontsize=14&hidenavigation=1&theme=dark
import React, { useEffect, useState } from "react";
import MDEditor, { RefMDEditor } from "@uiw/react-md-editor";
export default function App() {
const [textarea, setTextarea] = useState<HTMLTextAreaElement>();
const [value, setValue] = React.useState("# Markdown Editor");
useEffect(() => {
console.log("$edit:12", textarea);
}, [textarea]);
function refCallback(node: RefMDEditor) {
if (node && node.textarea) {
setTextarea(node.textarea);
}
}
return (
<div className="container">
<h3>Auto</h3>
<MDEditor
ref={refCallback}
height={200}
value={value}
onChange={(val) => {
setValue(val || "");
}}
/>
</div>
);
}
wow, thank you!! you are doing an amazing work here
I would like to have the control of the textArea input