CodePen is rejecting my fat arrow

Hey guys!

I’m working on the Markdown Previewer challenge (I thought it’d be easy, turns out I’m wrong. Usually works that way.) This is my first time using React in the CodePen environment—I’ve just recently completed all the React challenges in their available alpha stage.

I’m using a “fat arrow,” and for some reason, CodePen keeps returning the error: “Unexpected token =”

What’s weird is I’m using the exact same code I used in one of the React challenges:

  handleChange = (event) => {
   this.setState({
     input: event.target.value
   });
  }

I made sure that React was listed as my first additional library, with React DOM coming second, but the problem persists.

I’m sure I could build it another way, but I want to understand what I’m doing wrong while trying to build it this way.

Here’s a link to my pen. If you guys have any insight here, I’d really appreciate it!

Never mind, sorry…

Codepen only supports ES2015 syntax.
But both ways are correct, since you’ll probably be using babel.
More info:
https://babeljs.io/docs/plugins/transform-class-properties/
and
https://babeljs.io/blog/2015/06/07/react-on-es6-plus#arrow-functions.

1 Like

Your code is fine, just put a semicolon after the closing bracket.

Cannot believe I missed something so simple. Thank you boss!

It’s called an arrow and it is used in arrow functions. “Fat” arrows is not very nice - arrows have feelings too.

3 Likes