Return 使用 React，出现语法错误？

Question

我是第一次使用React，语法有点迷糊。在 Sublime Text 中，我在下面的代码中 return 之后的左括号中不断收到错误消息，说没有闭包，但是我清楚地看到它靠近这串文本的末尾。

return (
      <>
        <section className="jumbotron jumbotron-fluid text-center">
          <div className="container py-5">
            <h1 className="display-4">Recipes for every occasion</h1>
            <p className="lead text-muted">
              We’ve pulled together our most popular recipes, our latest
              additions, and our editor’s picks, so there’s sure to be something
              tempting for you to try.
            </p>
          </div>
        </section>
        <div className="py-5">
          <main className="container">
            <div className="text-right mb-3">
              <Link to="/recipe" className="btn custom-button">
                Create New Recipe
              </Link>
            </div>
            <div className="row">
              {recipes.length > 0 ? allRecipes : noRecipe}
            </div>
            <Link to="/" className="btn btn-link">
              Home
            </Link>
          </main>
        </div>
      </>
    );
  }

}
export default Recipes;

代码在中的反斜杠之后似乎乱七八糟，后面的所有内容都与字符串颜色相同。

我在这里错过了什么？

Answer 1

您的 Sublime Text JSX 荧光笔可能太老了，不支持 <> 语法。

或者：

更新荧光笔（Package Control 中可能有更好的）
对片段使用长格式 <React.Fragment>...</React.Fragment> 语法。

Return 使用 React，出现语法错误？

Return with React, getting a syntax error?

sublimetext3

reactjs