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)