Передача props между компонентами в React

import { sample } from 'rxjs/internal/operators'; 
import React from 'react'; 
import ShoppingCard from './ShoppingCard'; 
import goods from './goods.json'; 
 
export default class ShoppingCards extends React.Component { 
    constructor (props){ 
        super(props); 
        this.shoppingCardsJSX = goods.map((good) => { 
            return ( 
                <ShoppingCard 
                    key = {good.id } 
                    goodId = {good.id} 
                    src = {good.src} 
                    descr = {good.descr} 
                    code = {good.code} 
                    size = {good.size} 
                    color = {good.color} 
                    price = {good.price} 
                    onRemoveCard={this.removeCard.bind(this) 
                    } 
                /> 
            ); 
        }); 
    } 
    removeCard(obj){ 
        const list = this.shoppingCardsJSX ; 
        for (let i = 0; i < list.length; i++){ 
            if (list[i].key === obj){                 
                list.splice(i, 1); 
                break; 
            } 
        } 
        this.forceUpdate();      
    } 
    render() { 
        return this.shoppingCardsJSX; 
    } 
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react.min.js"></script> 
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react-dom.min.js"></script>

import React from 'react'; 
import main_logo from '../images/logo-main.png'; 
import ShoppingCard from './ShoppingCard' 
 
class SeekBlock extends React.Component { 
    render() { 
        return ( 
            <label htmlFor={this.props.id}> 
                <input type = "text" placeholder="Поиск по сайту" className={this.props.className} id = {this.props.id}/> 
            </label> 
        ) 
    } 
} 
export default class SearchBlock extends React.Component { 
    constructor(props) { 
        super(props); 
        this.spanObject = { userName: 'Анастасия'}; 
    } 
    render() { 
        return ( 
           <div className="search-block"> 
             <img className="main-logo" src = {main_logo} alt ={this.props.className}/> 
             <div className="seek-block"> 
                <SeekBlock className="search-string" id = "search"/> 
             </div> 
             <div className="account-block"> 
                 <div className="user-info user-info--name"> 
                    <a className="user-info__user-name" href="/">{this.spanObject.userName}</a> 
                 </div> 
                 <div className="user-info user-info--user-bucket"> 
                     <a className="user-info__bucket" href="/" >В корзине: 4 <br/> товара</a> 
                 </div> 
             </div> 
           </div> 
        ); 
    } 
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react.min.js"></script> 
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react-dom.min.js"></script>