Pass the event handler can't figure it out


#1

I’ve looked at the forum and can’t figure out what is wrong with my code. I’m sure its something that I’m just missing. I’ve signed out and in and reset the challenge in case that could have been the issue.


export class Child extends React.Component {
  render() {
    return (
      <div>
        <h1>
          Hey my name is {this.props.name}!
        </h1>
        <select id="great-names">
          <option value="Frarthur">
            Frarthur
          </option>

          <option value="Gromulus">
            Gromulus
          </option>

          <option value="Thinkpiece">
            Thinkpiece
          </option>
        </select>
      </div>
    );
  }
}
import ReactDOM from 'react-dom';
import { Child } from './Child';

class Parent extends React.Component {
  constructor(props) {
    super(props);

    this.state = { name: 'Frarthur' };
    this.changeName = this.changeName.bind(this);
  }
  
  
  changeName(newName) {
    this.setState({
      name: newName
    });
  }

  render() {
    return <Child 
    		name={this.state.name}
        onChange={this.changeName(this.state.name)}/>
  }
}

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

#3

https://www.codecademy.com/courses/react-102/lessons/child-updates-parents-state/exercises/child-parent-pass-handler?action=lesson_resume

This line can be shortened. We only need to pass the method, not its invocation.


#4

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