Pass variable from one component to another in React Native

I have a component that calculates the imc :

class CalculateScreen extends React.Component {
  constructor(props) {
    super(props);
    this.state = {peso: '', altura: '', imc: 0};
  }
  calculateImc = () => {
    const { peso, altura } = this.state;
    this.setState({
      imc: (Number(peso) / (Number(altura)*Number(altura))) * 10000
    });
  }
  static navigationOptions = {
    title: 'Calcular IMC',
    headerTintColor: 'white',
    headerStyle: {
        backgroundColor: '#e74c3c',
        marginTop: Expo.Constants.statusBarHeight
      },
    headerTitleStyle: {
      padding: 50,
      color: '#ecf0f1',
    }
  };
  render(){
    const { navigate } = this.props.navigation;
    return(
      <Image style= { styles.imgContainer} source= {require('./src/img/white.jpg')}>
        <View style={styles.textNumberContainer}>
          <TouchableOpacity style= {styles.buttonContainer}>
            <Text style= {styles.buttonText}>Peso (kg) : </Text>
          </TouchableOpacity>
          <TextInput
            style= {styles.input}
            underlineColorAndroid='transparent'
            placeholder= 'Peso'
            keyboardType="numeric"
            value= {this.state.peso}
            onChangeText= {(peso) => this.setState({peso})}
          />
        </View>
        <View style={styles.textNumberContainer}>
          <TouchableOpacity style= {styles.buttonContainer}>
            <Text style= {styles.buttonText}>Altura (cm): </Text>
          </TouchableOpacity>
          <TextInput
            style= {styles.input}
            underlineColorAndroid='transparent'
            placeholder= 'Altura'
            keyboardType="numeric"
            value={this.state.altura}
            onChangeText={(altura) => this.setState({altura})}
          />
        </View>
        <View style={styles.btnCalculateContainer}>
          <TouchableHighlight onPress={this.calculateImc} style={styles.buttonCalculate}>
            <Text style={styles.buttonTextCalculate}>Calcular</Text>
          </TouchableHighlight>
        </View>
         <View style={styles.textNumberContainer}>
          <TouchableOpacity style= {styles.buttonContainer}>
            <Text style= {styles.buttonText}>IMC : </Text>
          </TouchableOpacity>
          <View style= {styles.border}></View>
          <Text>{this.state.imc}</Text>
        </View>
        <View style= {styles.footer}>
          <TouchableOpacity onPress= { ()=> navigate('Result') } style={styles.buttonResult}>
            <Text style={styles.buttonTextFooter}>Resultados</Text>
          </TouchableOpacity>
        </View>
      </Image>
    );
  }
}

The variable imc remains in this.state.imc , how can I pass it to another component to use its value? I want to pass it here:

class ResultScreen extends React.Component {

  static navigationOptions = {
    title: 'Result',
    headerTintColor: 'white',
    headerStyle: {
        backgroundColor: '#e74c3c',
        marginTop: Expo.Constants.statusBarHeight
      },
    headerTitleStyle: {
      padding: 70,
      color: '#ecf0f1',
    }
  };

  render(){
    const { navigate } = this.props.navigation;
    if(this.state.imc < 16){
    return(
    <Image style= { styles.imgContainer} source= {require('./src/img/white.jpg')}>
      <Text style= {styles.text}>Delgadez Severa</Text>
    </Image>
    );
  }

How can I pass the value to this component?