reactjs - 如何在我的代码中使用这个 react-hook 函数？

Question

我正在尝试自定义我的 Amplify UI...我不确定如何继续。我试图在我的代码中使用这个自定义函数：

    import Amplify, { Auth } from 'aws-amplify';



export default class SignupPage extends Component {
  handleSignUp = event => {
    event.preventDefault();
    const{username, email, password, phone_number} = this.props.inputs;
    Auth.signUp({
      username,
      password,
      attributes:{
        email,
        phone_number
      },
      validationData: []
    })
      .then(data => console.log(data))
      .then(()=>this.props.switchComponent("Verify"))
      .catc(err => console.log(err))
    };
}

function SignupPage() {
  const [firstFocus, setFirstFocus] = React.useState(false);
  const [lastFocus, setLastFocus] = React.useState(false);
  const [emailFocus, setEmailFocus] = React.useState(false);
  const [passwordFocus, setPasswordFocus] = React.useState(false);
  React.useEffect(() => {
    document.body.classList.add("signup-page");
    document.body.classList.add("sidebar-collapse");
    document.documentElement.classList.remove("nav-open");
    window.scrollTo(0, 0);
    document.body.scrollTop = 0;
    return function cleanup() {
      document.body.classList.remove("signup-page");
      document.body.classList.remove("sidebar-collapse");
    };

  }, []);

但我不断收到此错误：

任何帮助，将不胜感激！

标签： reactjsreact-hooksaws-amplify