问题描述
我正在尝试构建一个网页来执行 CRUD 操作。如何从 Ckeditor 获取数据并在 React 的 Json 服务器中发布?
这是我的代码
注意:此代码适用于普通输入表单,但在 Ckeditor 部分中不起作用
import axios from 'axios';
import { useHistory,Link } from 'react-router-dom';
import Header from '../Header/Header';
import bgpic from './a215_1_cover_image.jpg';
import { CKEditor } from '@ckeditor/ckeditor5-react';
import ClassicEditor from '@ckeditor/ckeditor5-build-classic';
const AddPost = () => {
let history = useHistory();
const [user,setUser] = useState({
title: '',img: '',body: '',});
const { title,img,body } = user;
const onInputChange = (e) => {
setUser({ ...user,[e.target.name]: e.target.value });
};
const onSubmit = async (e) => {
e.preventDefault();
await axios.post('http://localhost:3001/post',user);
history.push('/');
};
return (
<>
<div className='container'>
<div className='w-75 mx-auto shadow p-5'>
<h2 className='text-center mb-4'>Your Blog</h2>
<form onSubmit={(e) => onSubmit(e)}>
<div className='form-group'>
<input
type='text'
required
className='form-control form-control-lg'
placeholder='Title'
name='title'
value={title}
onChange={(e) => onInputChange(e)}
/>
</div>
<div className='form-group'>
<CKEditor
name='body'
value={body}
editor={ClassicEditor}
onChange={(e) => onInputChange(e)}></CKEditor>
</div>
</form>
</div>
</div>
</>
);
};
export default AddPost;
每当我试图在文本编辑器部分写作时,这就是错误
解决方法
暂无找到可以解决该程序问题的有效方法,小编努力寻找整理中!
如果你已经找到好的解决方法,欢迎将解决方案带上本链接一起发送给小编。
小编邮箱:dio#foxmail.com (将#修改为@)