#ReactJs有什么问题，“导入”和“导出”可能仅出现在顶层？

Question

我的代码有什么问题反应

export const BeritaView = ({ match }) => {
  const article = articles.find(item => item.id === match.params.id);
   console.log(articles, match.params.id);
   return(
      <div>
          <h3> News ID: {match.params.id} </h3>
          <h4> {article.title} </h4>
          <p> {article.content} </p>
          <Link to={`/berita`}> Back to Berita dan Kegiatan </Link>
      </div>
   )  
}

错误将其称为：

  

“导入”和“导出”可能仅出现在顶层

有人可以帮助我吗？

Answer 1

大多数情况下，当您在反应代码中错过了右方括号时，就会出现此错误。

Answer 2

大多数时候我都会遇到这个错误，当你错过一个括号时就会发生这种情况。

Answer 3

ES6模块是静态的。这意味着export / import不能出现在函数，条件语句中或包含变量。这主要是出于效率原因。

该错误表示您已将export嵌套在某处-可能在函数内。

---

通过仅在顶层允许而不嵌套的模块在语法上强制实施静态结构。这意味着在编译时就知道了该代码结构，从而可以消除无效代码，更小的捆绑包大小和更快的查找。

我建议阅读this。