Eu criei três componentes básicos.

A renderiza os componentes B e C B é como o cabeçalho que contém as guias 1,2,3 C. É a primeira página na qual existem dois formulários, um exibido por vez. Ao mostrar o primeiro formulário, preciso mostrar a guia 1 1 no componente B. Ao mostrar o segundo formulário, preciso mostrar a guia 3 no componente B.

Eu só quero passar os dados do componente C com base em qual formulário está sendo mostrado para o componente B.

Coloquei o estado no componente C e tentei usar o mesmo this.state.data ou this.props.data para nenhum valor vindo no controlador B.

A.jsx

import React from 'react';
import B from './B.jsx';
import C from './C.jsx'
class A extends React.Component {
    constructor(props) {
        super();
        this.state = {
            show : '1',
        }
    }
    render() {
        return (
            <div>{this.props.show}
                <B />
                <C/>
            </div>
        )
    }
}

export default A;

B.jsx

import React from 'react';

class B extends React.Component {
    constructor(props) {
        super(props);
        this.state = {
            show : '1',
        }
    }
    render() {
        return (
            //html code here
        )
    }
}

C.jsx

class C extends React.Component {
    constructor(props) {
        super(props);
        this.state = {
            show : '1',
        }
    }
    render() {
        return (
            //html code here
        )
    }
}