javascript - 解析错误 : Unexpected token, 预期 ","

Question

我在 React js 中有以下代码。

class Posts extends Component {
  render() {
    return (
      {console.log('test')}
    );
  }
}

运行这段代码后出现错误

Parsing error: Unexpected token, expected ","

   8 |     return (
>  9 |       {console.log('test')}
     |       ^
  10 |     );
  11 |   }
  12 | }

更新

用父标签包裹它会返回同样的错误

>  9 |       <div>
     |       ^
  10 |         {console.log('nothing')}
  11 |       </div>

更新

这是全类

import React, { Component } from 'react';
import { connect } from 'react-redux';

class Post extends Component {
  render() {
    return (
      <div>
        {console.log('test')}
      </div>
    );
  }
}

const mapStateToProps = (state) => {
  return {
    posts: state
  }
};

export default Post;

Answer 1

当返回 jsx 时，你总是需要有一个包装父 JSX 标签。因为你没有任何 jsx 标签，所以它只是无效的 javascript。应该是:

class Posts extends Component {
  render() {
    return console.log('test')
  }
}

或者如果你想要 jsx

class Posts extends Component {
  render() {
    return (
      <div>
        {console.log('test')}
      </div>
    )
  }
}

编辑(2020-1-19)

jsx 现在支持父闭包的空标签:

class Posts extends Component {
  render() {
    return (
      <>
        {console.log('test')}
      </>
    )
  }
}