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;

在应用程序页面中，您只需像这样导入:

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

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

我学习了 Typescript 的 React，所以有些问题可以更容易避免，如果你愿意，我建议一起学习。