如何解决将数据从后端设置到文本编辑器,然后更改这些数据
import draftToHtml from "draftjs-to-html";
import { Editor } from "react-draft-wysiwyg";
import { EditorState,convertFromraw,convertToRaw } from "draft-js";
const Sampleform=()=>{
const { ContextData } = useContext(SomeContext);
const [data,setData] = useState(EditorState.createEmpty());
const[loading,setLoading]=useState(false);
const [details,setDetails] = useState({
body:data,date: null,datanew: true,});
useEffect(() => {
setLoading(true);
(async () => {
if (details) {
setDetails(
details
)
}else{
try{
setDetails({...details,body: //body deatils whick comes from backend
});
setDetails(details);
}catch(error){
console.log(error);
}
}
})
},[])
useEffect(() => {
setLoading(true);
if (details && details.datanew) {
try {
getNewDetails();
} catch (error) {
console.log(error);
}
}
},[ContextData]);
const getNewDetails =()=>{
//func working
}
return(
<Formik
enableReinitialize={true}
initialValues={letterBody}
validationSchema={validationSchema}
onSubmit={(letterBody,{ setSubmitting }) => {
details.body = draftToHtml(letter.getCurrentContent());
}}
>
{({
values,handleBlur,handleChange,setFieldValue,handleSubmit,isSubmitting,errors,touched,}) => (
<Form>
{/* data input here its works fine */}
<div>
<Editor
editorState={data}
wrapperClassName="demo-wrapper"
editorClassName="demo-editor"
onEditorStateChange={(data) => setData(data)}
value={data}
onblur={handleBlur}
toolbar={{
options: ["inline","list","link","remove"],inline: {
options: ["bold","italic","underline"],bold: { className: "bordered-option-classname" },italic: { className: "bordered-option-classname" },underline: { className: "bordered-option-classname" },},}}
spellCheck={true}
/>
</div>
</Form>
)}
</Formik>
);
};
export default Sampleform;
**想将来自后端 API 的数据发送到我的文本编辑器,然后从文本编辑器更改这些数据,在这里日期组件运行良好,但文本编辑器没有任何意义,如何解决这个问题我正在使用“react-draft-WYSIWYG”文本编辑器与 formik **
我在上面提供了一个代码示例,什么是完成上述任务的最佳方法,使用 react useEffect 和 "react-draft-WYSIWYG" with formik ,文本编辑器的值不会改变我的状态
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。