How to access state/props in another jsx file

Question

This is a whitebox.jsx file where i have a state "wbimage", it should contain an image url that will be displayed in className="wbimgframe". I want to access and edit this state ie, give image url to "wbimage" in another jsx file - javaa.jsx

whitebox.jsx

import "./whitebox.css"

class Whitebox extends Component {

constructor(props) {
    super(props);
    this.state ={
                    wbimage: '',
                };
}

render() {
    return (
    <div>
            <div className="wbdemo" >
                <div className="wbimgframe">
                    <center>
                        <img src={this.state.wbimage} alt="Given image will be displayed here"/>
                    </center>
                </div>
                <div className="wbdemobookname">
                    <label>Book Name</label>
                </div>
                <div className="wbdemobookauthor">
                    <i><label>By </label>
                    <label>Book Author</label></i>
                </div>
            </div>
        </div>);
        }
    }
export default Whitebox;

I have tried this, but still nothing is displayed in image.

javaa.jsx

import Whitebox from "./whitebox";
import "./javaa.css";

class Javaa extends Component {
    render() {
        return (
        <div>
        <br/><br/><br/><br/><br/>
            <div className="javaamp">
                <Whitebox>
                    {this.props.wbimage} = "https://cdn.codegym.cc/images/article/960defdc-e2f5-48ac-8810-d8b4436a88a7/512.jpeg"
                </Whitebox>
            </div>
        </div>);
    }
}

export default Javaa;

Please help, I am a beginner. So if this question seems easy, please don't mind :)

Answer 1

parent component (From where you have to send the data)

   <Whitebox wbimage="https://cdn.codegym.cc/images/article/960defdc-e2f5-48ac-8810-d8b4436a88a7/512.jpeg">

Child component (from where you are gonna receive the data and use it in your HTML.

console.log(this.props.wbimage)

Check out this to understand better https://reactjs.org/docs/components-and-props.html