我尝试将数据文件（对象数组）中的各种信息嵌入到App.js文件中的card示例中。到目前为止，所有信息都显示正确。问题是照片没有显示。我已经尝试过在导入时更改路径。并将图像文件夹从src移到了public。不幸的是，两人都没有做任何事情。问题还能出在哪里？.map中是否存在错误？
谢谢你的建议。

import './App.css';
import Card from './components/Card';
import Hero from './components/Hero';
import Navbar from './components/Navbar';
import Data from "./components/Data";

function App() {

  const cards = Data.map(item => {
    return (
      <Card 
      img={item.coverImg}
      rating={item.stats.rating}
      reviewCount={item.stats.reviewCount}
      location={item.location}
      title={item.title}
      price={item.price}
      />
    )
  })

  return (
    <div className="App">
      <Navbar />
      <Hero />
      {cards}
    </div>
  );
}

export default App;

export default [
    {
        id: 1,
        title: "Life Lessons with Katie Zaferes",
        description: "I will share with you what I call \"Positively Impactful Moments of Disappointment.\" Throughout my career, many of my highest moments only came after setbacks and losses. But learning from those difficult moments is what gave me the ability to rise above them and reach my goals.",
        price: 136,
        coverImg: "katie-zaferes.png",
        stats: {
            rating: 5.0,
            reviewCount: 6
        },
        location: "Online",
        openSpots: 0,
    },
    {
        id: 2,
        title: "Learn Wedding Photography",
        description: "Interested in becoming a wedding photographer? For beginner and experienced photographers alike, join us in learning techniques required to leave the happy couple with memories that'll last a lifetime.",
        price: 125,
        coverImg: "wedding-photography.png",
        stats: {
            rating: 5.0,
            reviewCount: 30
        },
        location: "Online",
        openSpots: 27,
    },
    {
        id: 3,
        title: "Group Mountain Biking",
        description: "Experience the beautiful Norwegian landscape and meet new friends all while conquering rugged terrain on your mountain bike. (Bike provided!)",
        price: 50,
        coverImg: "mountain-bike.png",
        stats: {
            rating: 4.8,
            reviewCount: 2
        },
        location: "Norway",
        openSpots: 3,
    }
]

import React from 'react'

function card(props) {
    return (
        <div className="card--footer">
            <img src={props.img}/>
            <p><img src="../images/star.png"></img>{props.rating} ({props.reviewCount}) USA</p>
            <p>{props.title}</p>
            <p><strong>From ${props.price}</strong> / Person</p>
        </div>
    )
}

export default card