BlogPost/src/Component/addPost.js

36 lines
915 B
JavaScript

import React, { useState } from 'react';
import "../styleing/addPost.css"
const AddPostForm = ({ onAddPost }) => {
const [newPost, setNewPost] = useState({ title: '', body: '' });
const handleSubmit = (e) => {
e.preventDefault();
if (newPost.title && newPost.body) {
onAddPost(newPost);
setNewPost({ title: '', body: '' });
} else {
alert('Title and Body are required!');
}
};
return (
<div className="addPostForm">
<input
type="text"
placeholder="Post Title"
value={newPost.title}
onChange={(e) => setNewPost({ ...newPost, title: e.target.value })}
/>
<textarea
placeholder="Post Content"
value={newPost.body}
onChange={(e) => setNewPost({ ...newPost, body: e.target.value })}
/>
<button onClick={handleSubmit}>Add Post</button>
</div>
);
};
export default AddPostForm;