Raziel
Raziel

Reputation: 1566

Unexpected token with a return statement

not sure what is going on, however, i am trying to return a material ui component when i loop through the keys of an object, however, i keep getting Unexpected token

I have posted my code below, i am unsure why this error is triggering:

  renderTableRow(subheader) {
    const { data, multiHeaderBy } = this.props;
    data.map((subdata) => {
      if (subdata[multiHeaderBy] === subheader) {
        Object.keys(subdata).forEach(key => return <TableRowColumn>scsc</TableRowColumn>);
      }
      return null;
    });
  }

Upvotes: 1

Views: 647

Answers (1)

Pointy
Pointy

Reputation: 413702

If you want to use an explicit return statement in your arrow function, you have to put the function body in { }:

    Object.keys(subdata).forEach(key => { return <TableRowColumn>scsc</TableRowColumn> });

The "simple" form of arrow functions without { } requires that the function body be a single expression, and return is not part of the expression grammar; it's a statement type of its own. That's why it's an "unexpected token" — after the =>, the parser expects either { or a token that can start an expression.

Upvotes: 1

Related Questions