时间戳

首页 > 解决方案 > 使用 React 返回，出现语法错误？

reactjs - 使用 React 返回，出现语法错误？

问题描述

这是我第一次使用 React，我对语法感到困惑。在 Sublime Text 中，我在以下代码中返回后不断收到左括号错误，说明没有闭包，但是我显然在该文本字符串的末尾附近有它。

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;

</> 中的反斜杠之后的代码似乎搞砸了，之后的所有内容都与字符串颜色相同。

我在这里想念什么？

标签： reactjssublimetext3

解决方案

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

任何一个：

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

推荐阅读