Latest version of chrome.
It’s been working fine in other exercises.
Went through my code many times looking for errors. I’m a beginner so it’s very possible I have an error somewhere that is causing it to not display.
Would love to be pointed in the right direction!
import React from 'react';
import ReactDOM from 'react-dom';
class Contact extends React.Component {
constructor(props) {
super(props);
this.state = {
password: 'swordfish',
authorized: true
};
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={this.authorize}>
<input
type='password'
placeholder='Password' />
<input type='submit' />
</form>
);
var contactInfo = (
<ul>
<li>
[email protected]
</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')
);