元素類型無效：需要一個字符串（對於內置組件）或一個類/函數（對於復合組件），但得到：對象。 ReactJS

Question

無法解決此問題。 每當我導入布局時，都會出現上述錯誤。 當我導入其他組件時，它們工作正常。 起初，我認為Layout是保留名稱，所以我對其進行了更改，但仍然遇到相同的錯誤。

App.js

import React, { Component } from 'react';
import Layout from "./components/Layout/Layout";

class App extends Component {
  render() {
    return (
      <div>
        <Layout />
      </div>
    )
  }
}

export default App

Layout.js

import React, { Component } from 'react'
import Footer from '../Footer/Footer'
import Quotes from '../Quotes/Quotes'
import './Layout.css'

class Layout extends Component {
    render() {
        return (
            <div className='bgImg'>
                <div className='centered text-center align-items-center justify-content-center'>
                    <Quotes />
                </div>
                <Footer />
            </div>
        )
    }
}

export default Layout

Answer 1

該錯誤告訴您確切應該做什么。
首先，請確保正確導出組件：

/* relevant imports */

class Quotes extends Component {
  /* component code */
}

export default Quotes

其次，使您在Layout組件中使用正確的導入語義：

import Quotes from '/path/to/your/component';

代替

import {Quotes} from '/path/to/your/component';