莫名其妙語法錯誤

Question

這是我的陣營組件

import React, { Component } from 'react' 

class ThingsList extends Component { 

    render() { 

     return (
      {this.props.things.map(thing => { 
       <p> hello </p> 
      })} 
     ) 
    } 
} 

export default ThingsList 

錯誤：

Syntax error: Unexpected token, expected , (8:8) 

    6 |  
    7 |  return (
> 8 |   {this.props.things.map(thing => { 
    |    ^
    9 |    <p> hello </p> 
    10 |   })} 
    11 |  ) 

我一直停留在這個像一小時

Answer 1

你正在寫在自由浮動的JSX JavaScript的中間部分。您需要「開始」編寫一些正確的jsx（以開頭<開頭），或者只需編寫普通的JavaScript。請記住，您無法在渲染中返回元素數組。

return (
    // need to create opening JSX tag which compiles to `React.createElement` 
    <span> 
    {this.props.things.map(thing => { 
     return <p> hello </p> 
    })} 
    </span> 
)