总是收到错误“超级表达式必须为空或函数，而不是未定义。”当我导航到此页面时

Posted 2023-02-22

【中文标题】总是收到错误“超级表达式必须为空或函数，而不是未定义。”当我导航到此页面时

【英文标题】：Always getting error "super expression must either be null or a function, not undefined." when I navigate to this page

【发布时间】：2016-10-08 17:17:31

【问题描述】：

'use strict';
import React, Component from 'react';
import  Tab, TabLayout  from 'react-native-android-tablayout';

import
  ViewPagerAndroid,
  View,
  StyleSheet,
  ScrollView,
  Text,
 from 'react-native';

import EventList from './javra-event-list';

var eventLayout = (
  <ScrollView>
    <EventList 
      title='Latest Event' 
      event='latest' 
      itemsPerRow=this.props.movies.length 
      items=this.props.movies direction=true/>
    <EventList 
      title='Event Type' 
      event='event' 
      itemsPerRow=this.props.movies.length 
      items=this.props.movies direction=true/>
    <EventList 
      title='Popular Event' 
      event='popular' 
      itemsPerRow=this.props.movies.length 
      items=this.props.movies direction=true/>
  </ScrollView>
);

var tabView = eventLayout;

export default class TabsUi extends Component 
  constructor(props) 
    super(props);
    this.state = 
      pagePosition: 0,
    
  

  render()
    return(
      <View style=marginTop:0, flex:1>
        <TabLayout  
          style =height:40, backgroundColor: 'skyblue' 
          selectedTab = this.state.pagePosition
          onTabSelected = this.setPagePosition.bind(this)>
          <Tab name="Events" style=styles.tab1/>
          <Tab name="User Uploads" style=styles.tab1/>
        </TabLayout>
        tabView
      </View>
    );
  

  setPagePosition(e:Event)
    const pagePosition = e.nativeEvent.position;
    console.log(pagePosition);
    this.setState(pagePosition);
    switch (pagePosition) 
      case 0:
        tabView = (
          <ScrollView>
            <EventList 
              title='Latest Event' 
              event='latest' 
              itemsPerRow=this.props.movies.length 
              items=this.props.movies direction=true/>
            <EventList 
              title='Event Type' 
              event='event' 
              itemsPerRow=this.props.movies.length 
              items=this.props.movies 
              direction=true/>
            <EventList 
              title='Popular Event' 
              event='popular' 
              itemsPerRow=this.props.movies.length 
              items=this.props.movies 
              direction=true/>
          </ScrollView>
        );
        break;
      case 1: 
        tabView = (
          <View>
            <Text>
              Tab content 2
            </Text>
         </View>
        );
        break;
      default:
    
    this.forceUpdate();
  

当我导航到此页面时，我总是收到上述错误。我使用了最新的 ECMA 脚本语法和最新的 react-native 版本 0.27。我的代码有什么问题？

任何建议都将不胜感激。

【问题讨论】：

***.com/questions/29452111/… 和 ***.com/questions/30116430/… 的可能重复

你的 package.json 中列出了什么版本的 react？

我使用了 15.0.2 版本的 react。我该怎么办？

【参考方案1】：

我遇到了同样的问题，我刚刚从https://github.com/AlbertBrand/react-native-android-tablayout 更新了 node_modules 上的两个文件 Tab.js 和 TabLayout.js 这对我有用，主要更改是调用导入模块。

import 
  React,
  Component,
  PropTypes,
  processColor,
  requireNativeComponent,
  View,
 from 'react-native';

替换为

import React, 
  Component,
  PropTypes
 from 'react';
import 
  processColor,
  requireNativeComponent,
  View,
 from 'react-native';

但最好替换整个文件

【参考方案2】：

现在 react-native-android-tablayout 已更新为大于 0.28v 的最新版本的 react-native。谢谢，这个图书馆的作者。 https://github.com/AlbertBrand/react-native-android-tablayout/issues/22

现在 android 支持 tablayout。