reactjs - react 补充未被读取

Question

我开始学习 react ，我在导入补充时遇到问题。它不会显示在应用程序上，也不会显示任何错误。
这是补码:

import "bootstrap/dist/css/bootstrap.css";

const cardComponent = () => {
  return (
    <div className="card">
      <img className="card-img-top" src="..." alt="Card image cap" />
      <div className="card-body">
        <h5 className="card-title">Card title</h5>
        <p className="card-text">
          Some quick example text to build on the card title and make up the
          bulk of the card's content.
        </p>
        <a href="#" className="btn btn-primary">
          Go somewhere
        </a>
      </div>
    </div>
  );
};

export default cardComponent;

应用程序代码是这样的:

import "./App.css";
import cardComponent from "./component/cardComponent";

const App = () => {
  return (
    <div className="App">
      <cardComponent />
    </div>
  );
};

export default App;

任何小费都会受到赞赏

Answer 1

让我试着给你一些提示:
总是从以下开始:

   import React from 'react';

把第一句话大写如下:

 const CardComponent = () => {
  return (
   .
   .
   .

   export default CardComponent;

在 App 页面中，您只需像这样导入:

import CardComponent from './components/molecules/Card';

 const App = () => {
 return (
  <div className="App">
   <CardComponent />
  </div>
  );
 };
export default App;

我学会了用 Typescript 使用react，所以有些更容易避免一些问题，如果你愿意，我建议一起学习。