class 构造函数必须在 React-native 中调用 'new' 错误

Question

所以我正在尝试使用 React Native 和 aws-amplify 来构建具有一个代码库的 Web 和移动应用程序。现在我刚刚将 withAuthenticator 组件添加到我的应用程序中，它在移动部分上运行良好，但是当我运行浏览器中的 Web 应用程序时，我无法在身份验证字段中输入，如果我单击在它上面，光标出现并立即消失，但如果我单击并按住鼠标按钮，我突然能够输入，只要我按住鼠标按钮。所以在那之后我尝试创建我的自定义身份验证器，它在移动设备上运行良好，但在网络上它返回了错误 class constructors must be invoked with 'new'。我的代码在下面希望有人能帮助我。谢谢！

  class MySignIn extends SignIn {

    constructor(props) {
      super(props);   
      this.state = {
          username: null,
          password: null,
          error: null
      }
      this.checkContact = this.checkContact.bind(this);
      this.signIn = this.signIn.bind(this);
  }


    render() {
      if (this.props.authState !== 'signIn') {
        return null;
      }
      return(
        <View style={{flex:1, backgroundColor: 'blue'}} behavior="padding">
        <Text>Stuff and Stuff</Text>
    </View>
      );
    }
  }

  export default withAuthenticator(Signout, false, [
    <MySignIn/>,
    <ConfirmSignIn/>,
    <VerifyContact/>,
    <SignUp/>,
    <ConfirmSignUp/>,
    <ForgotPassword/>,
    <RequireNewPassword />
  ]);

Answer 1

class MySignIn extends SignIn 这对吗？我通常导入 class 个 class MySignIn extends React.Component

这行得通，因为他们从

导入了 signIn

import { ConfirmSignIn, ConfirmSignUp, ForgotPassword, RequireNewPassword, SignIn, SignUp, VerifyContact, withAuthenticator } from 'aws-amplify-react';

因此这是一个自定义 class 组件，因此它有效

// This is my custom Sign in component
class MySignIn extends SignIn {
  render() {
    ...
  }
}

这行得通。希望对你有帮助

class 构造函数必须在 React-native 中调用 'new' 错误

class constructors must be invoked with 'new' error in React-native

react-native

aws-amplify