React-native:超级表达式必须为 null 或函数,而不是未定义

Posted

技术标签:

【中文标题】React-native:超级表达式必须为 null 或函数,而不是未定义【英文标题】:React-native: Super expression must either be null or a function, not undefined 【发布时间】:2016-10-07 04:31:10 【问题描述】:

我看到有人问过类似的问题,但我似乎无法确定问题所在。 我正在使用 react native v 0.27 我已将所有 require 方法更改为导入。

这是我收到的错误:

我不知道它是否相关,但错误的第一个位置指向我的 LoginComp.js 文件,其中包含以下代码:

/**
 * Sample React Native App
 * https://github.com/facebook/react-native
 */
'use strict';
import React, 
  AppRegistry,
  Component,
  StyleSheet,
  Text,
  View,
  Image,
  TextInput,
  Button,
  TouchableHighlight
 from 'react-native';

class LoginComp extends Component 
  constructor()
    super(props);
  
  render() 
    return (
      <View style=flex: 1>
        <View style=this.props.styles.loginLogoContainer>
          <Image style=this.props.styles.view1logo source=require('../imgs/Logo.png') />
        </View>
        <View style=this.props.styles.loginContainer>
          <Text>Użytkownik:</Text>
          <TextInput
            style=this.props.styles.defaultInput
            placeholder="Użytkownik"
            stretch=true
            autoComplete=false
            autoCorrect=false
          />
          <Text>Hasło:</Text>
          <TextInput
            style=this.props.styles.defaultInput
            placeholder="Hasło"
            stretch=true
            autoComplete=false
            autoCorrect=false
            secureTextEntry=true
          />
        <TouchableHighlight onPress=this.props.LoginPress>
            <Text style=this.props.styles.loginButton>Login</Text>
          </TouchableHighlight>
        </View>
        <View style=this.props.styles.registrationWrapper>
          <Text>- lub -</Text>
          <TouchableHighlight onPress=this.props.t_Registration>
            <Text style=this.props.styles.registration>Załóż nowe konto</Text>
          </TouchableHighlight>
        </View>
      </View>
    );
  


module.exports = LoginComp;

【问题讨论】:

【参考方案1】:

如下所示更改您的导入语句并尝试。

import React,  Component  from 'react';

import 
  AppRegistry,
  StyleSheet,
  Text,
  View,
  Image,
  TextInput,
  Button,
  TouchableHighlight,
 from 'react-native';

构造函数也应该如下所示

constructor(props)
    super(props);

【讨论】:

谢谢 - 它解决了我的问题。但是为什么一定要这样呢? 在最新版本的 react native 中,'React' 和 'Component' 从 'react-native' 移动到了 'react' 模块。所以你必须使用上述方式导入它。 那么上下文传递给构造函数呢?? 两个提示:1)如果你在构造函数中的唯一语句是调用super,你可以完全省略构造函数。当省略构造函数时,ES6 将隐式调用super。 2) 如果您确实希望您的构造函数存在,我建议您像这样调用 super:constructor() super(...arguments) 。这将确保您的所有论点都得到传递。【参考方案2】:

就个人而言,我用另一种方式解决了这个问题:

我正在导入一个默认模块,例如 import Module from "./path/to/Module.js"。 但是在Module.js文件中,我省略了默认关键字export class Module /*...*/ -> export default class Module /*...*/

希望这会对某人有所帮助。 =)

【讨论】:

【参考方案3】:

我遇到了同样的问题。错误导入

import React,  Component  from "react-native";

而不是

import React,  Component  from "react";

看到这个答案https://***.com/a/37676646/5367816

【讨论】:

【参考方案4】:

只需在 App.js 文件中添加道具

类型道具 = ; 导出默认类 App 扩展组件

【讨论】:

【参考方案5】:

我在尝试使用时遇到了这个错误:

class Leaderboard extends React.component 


它应该是带有大写 C 的组件!

【讨论】:

【参考方案6】:

可能是最新版本的expo/react native 不支持@expo/react-native-action-sheet@2.5.0

升级@expo/react-native-action-sheet 对我有用:

纱线添加@expo/react-native-action-sheet@latest

【讨论】:

以上是关于React-native:超级表达式必须为 null 或函数,而不是未定义的主要内容,如果未能解决你的问题,请参考以下文章

为啥我得到 Typeerror 超级表达式必须为 null 或函数?

ReactJS - 超级表达式必须为空或函数,而不是未定义

如何解决:TypeError:超级表达式必须为null或函数

未捕获的类型错误:超级表达式必须为 null 或函数,而不是 undefined(...)

React Native - 超级表达式必须为空或函数,而不是未定义

TypeError:超级表达式必须为空或函数,在 ReactJS 中未定义 [重复]