Reputation: 1566
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
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