类构造函数必须在 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 MySignIn extends React.Component

这是有效的，因为他们已从

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

因此这是一个自定义类组件，因此它可以工作

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

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