Unable to send state data as props to another component - reactjs

Question

I am new to react. And I am trying to build an electron app using react js.
I want to send a parent component state value to child component as props.
The parent component is Home, and the child component is Help.
Home.jsx
export default class Home extends Component {
constructor(props) {
super(props);
this.state = {
step: 1,
name: "",
address: "",
amount: "",
}
}
handleChange = (e) => {
let nam = e.target.name;
let val = e.target.value;
this.setState({ [nam]: val });
}
render() {
const {date} = this.state;
const values = {date}
return(
<Fragment>
<label id="form-name">Name: </label>
<input
type="text"
name="name"
id="input-name"
onChange={this.handleChange}
/>
{other values}
<Link to="/help" className="btn">next </Link>
</div>
</Fragment>
);
return(
<Help
{...this.state}
/>
)
}
}
Help.jsx
import React, {Component, Fragment} from 'react';
import { Link } from 'react-router-dom';
export class Help extends Component {
continue = () => {
window.print();
}
render() {
return(
<Fragment>
<p id="date">Date : {this.props.date}</p>
<p id="name">RECIEVED With thanks from {this.props.name}</p>
<Link to="/"><button id="btn-print" onClick={this.continue} value="Print"> Print</button></Link>
<button id="btn-back" onClick={this.goBack}>
Back
</button>
</Fragment>
)
}
}
export default Help;
Thank you for Your help

Answer 1

don't use class based component instead you can use functional component like this
const help = (props) => {
continue = () => {
window.print();
}
render() {
return(
<p id="date">Date : {props.date}</p>
<p id="name">RECIEVED With thanks from {props.name}</p>
<Link to="/"><button id="btn-print" onClick={this.continue} value="Print"> Print</button></Link>
<button id="btn-back" onClick={this.goBack}>
Back
</button>
</Fragment>
)
}
}