React components Authorization form project

Hi every body. please can any one help me to fix this problem in the task 8 of the project when i try to execute my code nothing its happen https://www.codecademy.com/paths/full-stack-engineer-career-path/tracks/fscp-react-part-i/modules/fecp-react-components/projects/authorization-form and explain me the this.state object and and the line 11 in my code this is my code :

import React from 'react';
import ReactDOM from 'react-dom';

class Contact extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      password: 'swordfish',
      authorized: false
    };
    this.authorize = this.authorize.bind(this);
  }

  authorize(e) {
    const password = e.target.querySelector(
      'input[type="password"]').value;
    const auth = password == this.state.password;
    this.setState({
      authorized: auth
    });
  }

  render() {
    const login = (
      <form action="#" onSubmit={authorize}>
    <input type="password" placeholder="Password" />
    <input type="submit" />
    </form>);
    const contactInfo = (
  <ul>
          <li>
            client@example.com
          </li>
          <li>
            555.555.5555
          </li>
        </ul>
    )
    return (
  <div id="authorization">
        <h1>{this.state.authorized === true ? Contact : "Enter the password"}</h1>
       
        {this.state.authorized === true ? contactInfo : login} 
      
    </div>
    );
  }
}

ReactDOM.render(
  <Contact />, 
  document.getElementById('app')
);

Hi @method3884535642
did you take a look at the browser’s console? It says 'Uncaught ReferenceError: authorize is not defined at Contact.render … '.
Search for ‘authorize’ inside the render method and check if it is correctly declared. If it is check if you reference it correctly.

1 Like

thanks a lot my friend you are amazing

You’re welcome…
Don’t forget that the console is also a good friend :wink:

1 Like

yes of corse friend and the inspect also

1 Like

This topic was automatically closed 41 days after the last reply. New replies are no longer allowed.