莫名其妙的语法错误

Question

这是我的 React 组件

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

您正在 JavaScript 中间编写自由浮动的 jsx。您要么需要 "begin" 编写一些适当的 jsx（以开头 < 开头），要么只编写普通的 JavaScript。请记住，您不能 return 渲染中的元素数组。

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

莫名其妙的语法错误

Baffling syntax error

jsx

reactjs