無法導出反應類

Question

有這個文件：

產品.jsx :

class Product extends React.Component{
    render(){
        return (
            <div className='item'>
                <div className='image'>
                    <img src="images/products/image-aqua.png" />
                </div>
                <div className="middle aligned content">
                    <div className="description">
                        <a>Fort Knight</a>
                        <p>Authentic renaissance actors, delivered in just two weeks.</p>
                    </div>
                    <div className="extra">
                        <span>Submitted by:</span>
                        <img src="images/avatars/daniel.jpg" className="ui avatar image" />
                    </div>
                </div>
            </div>
        )
    }
}


export default Product;

和ProductList.jsx ：

import Product from "./Product";

class ProductList extends React.Component{
    render(){
        return (
            <div className='ui unstackable items'>
                <Product />
            </div>
        )
    }
}

ReactDOM.render(
    <ProductList />,
    document.getElementById('content')
);

React Class <Product />未呈現（如果我嘗試簡單地將 Product 類粘貼到 ProductList.jsx 中，那么沒問題，但我希望每個類都有單獨的文件，如何實現？）

Answer 1

在 Product.jsx 中使用import React from "react";

stackblitz 中的演示

Answer 2

1. 首先在頂部導入 React。

    import React from "react";

2. 其次，您可能在頂部給出了錯誤的地址。 確保它是正確的。 你很了解這條路。 除了這些，我沒有看到代碼有任何問題。

    import Product from "./Product";