我得到了这个eslint错误:

首选默认导出

import React, { Component } from 'react';

class HomePage extends Component {
  render() {
    return (
      <div className="Section">HomePage</div>
    );
  }
}

export { HomePage };

I have tried doing:

然后我得到了一个致命的解析错误.

然后我把它改成:

export default HomePage;

这将清除eslint错误.

但随后抛出:

"./HomePage"不包含名为"HomePage"的导出.

因为我是这样称呼主页的:

如果我删除括号,则会出现以下错误:

在中找不到"导出"默认"(导入为"主页")

import HomePage from './HomePage';
<PrivateRoute exact path="/" component={HomePage} />

将其更改为首选默认导出的正确方式是什么?

推荐答案

eslint-plugin-import

When there is only a single export from a module, prefer using default export over named export.

class HomePage extends Component {
  //....
}

export default HomePage

在另一个文件中:

import HomePage from './Hello';

判断这里codesandbox

Reactjs相关问答推荐

我的组件在jsx文件中继续重新渲染

如何使用json将购物车数组传递到后台API

构建next.js项目时状态不变,但在dev服务器中

将cy.get()与动态类名一起使用?

如何在单击行中的图标时避免选中ionic 复选框?

有没有一种方法可以在没有强烈动画的情况下有条件地渲染组件?

子路径上未定义useMatches句柄

useRef()的钩子调用无效

如何使用 React 获取表单中的所有值?

Material-UI 和 React Hook 表单不记录值

React Context API 在 Next.js 中更改路由时获取默认数据

Reactjs:MUI5:MobileDateTimePicker API:如何自定义日历中的文本

无法访问 usefocusEffect 中 const 的更新状态

如何在 React map 函数循环中使用
标签

如何在 nextjs 中单击按钮时动态导入和渲染组件?

具有自动完成功能的 Formik material ui 无法按预期工作

如何解决在 react.js 中找不到模块错误

在 React 中使用使用状态挂钩合并两个数组

Material UI 安装和 React v. 18.2 出现问题

如何在 NavBar 中设置动态标题