unexpected token using es6 map()

Question

Is there anything wrong with my code below?

render(){
    return (
      var users= this.state.users.map(user => 
        <li key={user.id}>user.name</li>
      )
      <ul>{users}</ul>
    )
  }

I get error: unexpected token.

There's a typo in your closing `` tag, you typed ``. – Yanis Vieilly Dec 20 '16 at 16:37 — Yanis Vieilly, Dec 20 '16 at 16:37

Ori Drori · Answer 1 · 2016-12-21T05:32:08.893

4

render() should return only a single element:

render(){
  return (
    <ul>
    {
      this.state.users.map(user => (
        <li key={user.id}>{user.name}</li>
      )
    }
    </ul>
  );
}

edited Dec 21 '16 at 05:32

answered Dec 20 '16 at 13:23

Ori Drori

166,183
27
198
186

ouch, forget bout that – Cassie Dec 20 '16 at 13:24
but means i can't assign loop to a variable? – Cassie Dec 20 '16 at 13:26
Sure you can - see @Chris's answer. – Ori Drori Dec 20 '16 at 13:26
1

I believe it should be `
{user.name}

John Weisz

Dec 20 '16 at 17:59

score 3 · Accepted Answer · edited Dec 21 '16 at 05:32

3

It is not clear what you're returning in your code. Either do all logic above your return call, as shown below, or do like Ori Drori does in their answer.

render() {
      var users= this.state.users.map(user => 
        <li key={user.id}>{user.name}</li>
      );

      return <ul>{users}</ul>;
   }
}

edited Dec 21 '16 at 05:32

Ori Drori

166,183
27
198
186

answered Dec 20 '16 at 13:23

Chris

53,920
18
108
124

unexpected token using es6 map()

2 Answers2