首页 > 解决方案 > 在 React.js 中导出组件时出错

问题描述

我正在将 React.js 组件 (Comp.jsx) 导出到 App.js(主文件)并收到此错误。

错误:./src/App.js 尝试导入错误:“./Components/Comp.jsx”不包含默认导出(导入为“Comp”)。

比较.jsx

import React from 'react'
import ReactDOM from 'react-dom'
function MyInfo() {

    return (
        <div>
            <h1>My Name</h1>
            <p>This is a Para</p>
        </div>
    )
}
ReactDOM.render(<MyInfo/>,document.getElementById('root'))

应用程序.js

import React from 'react';
import Comp from './Components/Comp.jsx';


function App() {
  return (
    <Comp>Hello World</Comp>
  );
}

export default App;

标签: javascriptreactjsjsx

解决方案


代替:

ReactDOM.render(<MyInfo/>,document.getElementById('root'))

将其移至App.js文件并渲染App

应用程序.js

ReactDOM.render(<App/>,document.getElementById('root'))

或者

加入. export default_Comp.jsx

比较.jsx

import React from 'react'
import ReactDOM from 'react-dom'

// \/ here
export default function MyInfo() {

    return (
        <div>
            <h1>My Name</h1>
            <p>This is a Para</p>
        </div>
    )
}
ReactDOM.render(<MyInfo/>,document.getElementById('root'))

推荐阅读