I have been trying to run this React Typescript App, but it keeps getting this error, and I have no idea what to do!2 errors states:
"Type '{}' is missing the following properties from type 'Readonly': isAdmin, username, history, location, match"
This here would be the code:
import * as React from 'react';import { RouteComponentProps } from 'react-router-dom';import { Link } from 'react-router-dom';interface IProps extends RouteComponentProps { isAdmin: boolean; username: string;}interface IState { posts: IPost[]; comments: IComment[];}interface IPost { id: number; title: string; body: string; author: string;}interface IComment { id: number; postId: number; body: string; author: string;}class Website extends React.Component<IProps, IState> { constructor(props: IProps) { super(props); this.state = { posts: [], comments: [], }; } public componentDidMount() { this.fetchPosts(); this.fetchComments(); } public render() { return (<div> {this.props.isAdmin && (<div><Link to="/create-post">Create Post</Link><Link to="/delete-post">Delete Post</Link></div> )} {this.props.username && (<div><Link to="/create-comment">Create Comment</Link><Link to="/edit-comment">Edit Comment</Link><Link to="/delete-comment">Delete Comment</Link></div> )}<div> {this.state.posts.map((post) => (<div key={post.id}><h2>{post.title}</h2><p>{post.body}</p><p>By: {post.author}</p></div> ))}</div><div> {this.state.comments.map((comment) => (<div key={comment.id}><p>{comment.body}</p><p>By: {comment.author}</p></div> ))}</div></div> ); } private createPost = (title: string, body: string) => { // Create a new post in the database }; private deletePost = (id: number) => { // Delete the post with the specified id from the database }; private createComment = (postId: number, body: string) => { // Create a new comment in the database }; private editComment = (id: number, body: string) => { // Edit the comment with the specified id in the database }; private deleteComment = (id: number) => { // Delete the comment with the specified id from the database }; private fetchPosts = () => { // Fetch posts from the database and update the state }; private fetchComments = () => { // Fetch comments from the database and update the state };}export default Website;
I really dont know where to fix it.