Question

有这个文件：

Product.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 类 <Product />（如果我尝试简单地将 Product 类粘贴到 ProductList.jsx 中，那么没问题，但我希望每个类都有单独的文件，如何实现？）

Answer 1

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

stackblitz 中的演示

Answer 2

首先在顶部导入 React。
```
import React from "react";
```
其次，您可能在顶部提供了错误的地址。确保它是正确的。你很了解这条路。除此之外，我认为代码没有任何问题。
```
import Product from "./Product";
```

无法导出反应类

2 个答案: