使用IntelliJ IDEA 2017创建React应用时let语法报错如何解决？

嘿，我来帮你搞定这个问题！你遇到的错误其实是代码不符合ES6类组件的语法规范，咱们一步步拆解修复：

问题1：类主体内不能直接用let声明变量 #

在ES6的类语法里，类的顶层作用域不能直接用let/var/const声明变量，这种写法本身就不合法。如果你需要定义组件的变量，有两种常用的正确方式：

• 在constructor构造函数里声明为实例属性
• 使用ES6类属性语法（直接在类里定义，不需要加let）

问题2：render方法位置错误 #

你的render()方法写在了类的外部，这完全不符合React类组件的要求——render是类组件的核心方法，必须作为类的成员方法定义在类内部。

修正后的完整代码 #

import React, { Component } from 'react';

class Projects extends Component {
  // 方式1：用类属性语法定义变量（无需let）
  projectItems;

  // 或者用方式2：在构造函数里声明（兼容更老的JS环境）
  // constructor(props) {
  //   super(props);
  //   this.projectItems;
  // }

  render() {
    console.log(this.props);
    return (
      <div className="Projects">
        My Projects
      </div>
    );
  }
}

export default Projects;

额外说明 #

• 如果你使用的是较老的JavaScript环境，可能不支持类属性语法，那优先选择构造函数的方式声明变量
• IDEA的错误提示本质是代码语法不合法导致的，修复代码后，那个“Expecting new line or semi colon”的错误自然就会消失

内容的提问来源于stack exchange，提问作者ttmt