ReactJS 'import' 和 'export' 可能只出现在顶层有什么问题?

IT技术 javascript reactjs
2021-05-12 04:59:32

我的代码react出了什么问题

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>
   )  
}

错误调用这个:

'import' 和 'export' 可能只出现在顶层

谁能帮我?

3个回答

当您错过react代码中的右括号时,您会遇到此错误。

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

该错误意味着您嵌套了某个地方export- 可能在一个函数内。


静态结构由module在语法上强制执行,仅允许顶级module,从不嵌套。这意味着代码结构在编译时是已知的,这允许消除死代码、更小的包大小和更快的查找。

我建议阅读此内容

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