Реагировать на собственную ошибку, связанную с push-данными, на два разных компонента

Question

Я пытаюсь отправить данные в свой компонент продукта представления, который состоит из двух компонентов, один из которых сам по себе, а другой представляет собой представление вкладки, пришедшее из другого класса, и оба они помещают в метод визуализации компонента продукта представления, и я отправляю данные один продукт, используя this.props.navigator.push, и я получаю доступ к данным о классе продукта представления, и я также хочу доступ к данным в моем классе представления вкладки. Я пытался использовать метод push для просмотра вкладок также с видом продукта, но из-за этого мое приложение падает, и это бесполезно.

Вот класс для просмотра продукта:-

import React, { Component,PureComponent } from 'react';
import {
 View,
 Text,
 StatusBar,
 TouchableOpacity,
  StyleSheet,
  TouchableHighlight,
  Image,
 ScrollView,
 TextInput,
 ListView,
} from 'react-native';

import Entypo from 'react-native-vector-icons/Entypo';
import Ionicons from 'react-native-vector-icons/Ionicons';
import MaterialCommunityIcons from 'react-native-vector-icons/MaterialCommunityIcons';
import EvilIcons from 'react-native-vector-icons/EvilIcons';
import ImageSlider from 'react-native-image-slider';
import { responsiveHeight, responsiveWidth} from 'react-native-responsive-dimensions';
import Hr from '../modules/hr.dist';
import Api from '../WooCommerce/Api';
import Css from '../Css/viewproduct';
import { TabViewAnimated, TabBar, SceneMap } from 'react-native-tab-view';
import TabView from './tabView';

export default class ViewProduct extends Component {
  
  render(){

    return(
       <View style = {{height: responsiveHeight(36)}}>
   <TabView value ={this.props.userData.product}/>
    </View>
    );
  }

и скрипт для просмотра вкладок:

import React, { PureComponent } from 'react';
import { View, StyleSheet,Text } from 'react-native';
import { TabViewAnimated, TabBar, SceneMap } from 'react-native-tab-view';
import { responsiveHeight, responsiveWidth} from 'react-native-responsive-dimensions';
import ViewProduct from './viewproduct';

const Description = () => <View style={[ styles.container, { backgroundColor: '#fff' }]}>
                            <Text style={{paddingTop:10,paddingLeft:10,textAlign:'justify'}}>{pro.description}</Text>
                          </View>;
const About = () => <View style={[ styles.container, { backgroundColor: '#fff' } ]}>
                      <Text style={{paddingTop:10,paddingLeft:10,textAlign:'justify'}}>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</Text>
                      </View>;
const pro =[''];

export default class TabView extends PureComponent {
  state = {
    index: 0,
    pro:[''],
    routes: [
      { key: '1', title: 'Description' },
      { key: '2', title: 'About' },
    ],
  };

  componentWillReceiveProps(product){
        pro= product;
  }

  _handleIndexChange = index => this.setState({ index });

  _renderHeader = props => <TabBar
                              {...props}
                              style = {{backgroundColor:"#fff"}}
                              labelStyle = {{color:"#000",fontFamily:"Montserrat-Regular",fontSize:12}}
                              tabStyle = {{width:responsiveWidth(33)}}
                              indicatorStyle = {{backgroundColor:"#36c3ff"}} />;

  _renderScene = SceneMap({
    '1': Description,
    '2': About,
  });

  render() {
    return (
      <TabViewAnimated
        style={styles.container}
        navigationState={this.state}
        renderScene={this._renderScene}
        renderHeader={this._renderHeader}
        onIndexChange={this._handleIndexChange}
      />
    );
  }
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
  },
});

и со своей страницы со списком продуктов я использую этот метод:-

pressButton(products){
  return this.props.navigator.push({id: 'viewproduct', userData: {product: products}});
 }

и теперь я хочу передать данные из списка продуктов или из представления продукта в класс представления вкладки и использовать эти данные для отображения описания в Const Description

Если кто-нибудь знает, пожалуйста, помогите.