Передать json через пропс в другой компонент и вятынуть данные

constructor(props) {
        super(props);
        this.state = {data: {}, isFetching: true, error: null};
    }
 
    componentDidMount() {
        fetch(API + DEFAULT_QUERY)
            .then(response => response.json())
            .then(result => {
                this.setState({data: result, isFetching: false})
                console.log(this.state);
            })
            .catch(e => {
                console.log(e);
                this.setState({data: JSON.parse(this.result), isFetching: false, error: e})
            });
    }
 
    render() {
        const {data, isFetching, error} = this.state;
        if (data) {
            return (
                <div>
                    <Header header={data.header}/> ----- вот тут пытаюсь передать полученный кусок json

const Header = (props) => (
    <div>
        <header>
            <nav className="navbar navbar-expand-md navbar-dark fixed-top bg-red">
                <a className="navbar-brand" href="#"><img src='../images/fire.png' style={{
                    'height': '25px',
                    'marginTop': '-6px'
                }}/> {props.title}</a>