Error trying to set up tabs in react-native

895 views Asked by At

I need a hand to correct my code. I want to display a page with 3 tabs with react-native-tab-view and I don't know why I have an error. could you help me find where it's stuck? What may seem obvious and easy to you may not be easy for me, so please be indulgent :) Thank you very much for your help and your time.

import * as React from 'react';
import { Dimensions } from 'react-native';
import { TabView, SceneMap } from 'react-native-tab-view';
import Information from '../Information';
import Photos from '../Photos';
import Stock from '../Stock';
import { getProducts } from '../../../../src/common/Preferences';
import styles from '../../../../assets/styles';
import i18n from '../../../../src/i18n';

const FirstRoute = () => (
  <Information style={styles.scene} />
);

const SecondRoute = () => (
  <Stock style={styles.scene} />
);
const ThirdRoute = () => (
  <Photos style={styles.scene} />
);

const initialLayout = { width: Dimensions.get('window').width };

export default class ProductDetails extends React.Component {
 constructor(props) {
    super(props);
      this.state = {
       // productId: (props.navigation.state.params && props.navigation.state.params.productId ? props.navigation.state.params.productId : -1),
        index: 0,
        routes: [{ key: '1', title: i18n.t("information.title"),icon: 'ios-paper', }, {icon: 'ios-paper', key: '2', title: i18n.t("stock.title") }, {icon: 'ios-paper', key: '3', title: i18n.t("photos.title") }],
    };
 }

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

 _renderScene = SceneMap({
    '1': FirstRoute,
    '2': SecondRoute,
    '3': ThirdRoute,
  });

render() {
  return (    
    <TabView      
      navigationState={this.state}
      renderScene={this._renderScene}
      initialLayout={initialLayout}
      onRequestChangeTab={this._handleIndexChange}
        useNativeDriver
    />    
    );
  };
}

I get :

TypeError: _this.props.onIndexChange is not a function. (In '_this.props.onIndexChange(index)', '_this.props.onIndexChange' is undefined)

0

There are 0 answers