反应原生 tabview 给出错误 TypeError: undefined is not an object (evaluating 'this')

时间:2021-02-19 10:43:46

标签: react-native react-native-android

我正在创建一个移动应用程序。在这个项目中,我创建了一个 tabview。我从互联网源复制了代码并粘贴到我的应用程序中。选项卡正常显示。但是当我切换到下一个选项卡时,它给了我一个错误 在控制台屏幕中。以下是错误详情:

TypeError: undefined is not an object (evaluating 'this')

这是我的代码:

import React, {useEffect, useState} from 'react';
import {View, StatusBar, Image, StyleSheet, Dimensions} from 'react-native';
import {Container, Button, Text, Header, Body} from 'native-base';
import {useNavigation} from '@react-navigation/native';
import {ScrollView} from 'react-native-gesture-handler';
import { TabView, SceneMap } from 'react-native-tab-view';

const LatestRoute = () => (
    <View style={[styles.scene, { backgroundColor: '#ff4081' }]} />
  );
  
  const FavoritesRoute = () => (
    <View style={[styles.scene, { backgroundColor: '#673ab7' }]} />
  );
  
  const AllRoute = () => (
    <View style={[styles.scene, { backgroundColor: '#673ab7' }]} />
  );

const App = () => {
    const initialState = {
        index: 0,
        routes: [
          { key: 'latest', title: 'Latest' },
          { key: 'favorites', title: 'Favorites' },
          { key: 'all', title: 'All' },
        ],
      };
    
      const [ state, setState ] = useState(initialState);
    
      function selectTab ( index ) {
        this.initialState = {
          index: index,
          routes: [
            { key: 'latest', title: 'Latest' },
            { key: 'favorites', title: 'Favorites' },
            { key: 'all', title: 'All' },
          ],
        };
        return setState(this.initialState);
      }
  let navigation = useNavigation();

  return (
    <Container>
      <TabView
        navigationState={state}
        renderScene={SceneMap({  latest: LatestRoute,  favorites: FavoritesRoute, all: AllRoute  })}
        onIndexChange={ (index) => selectTab(index) }
        initialLayout={{ width: Dimensions.get('window').width, height : Dimensions.get('window').height }}
      />
    </Container>
  );
};

const styles = StyleSheet.create({
  btns: {
    width: '80%',
    marginLeft: 'auto',
    marginRight: 'auto',
    justifyContent: 'center',
    marginTop: '10%',
  },
  registerTitle: {
    color: 'red',
    textTransform: 'uppercase',
    fontSize: 18,
  },
  scene: {
    flex: 1,
  },

});

export default App;

如果有人知道错误,请告诉我:

0 个答案:

没有答案