React组件中的图像加载在一页上而不是另一页上?

大家好,这个问题很简单。我有一个主页和一个房间页面。问题是,为什么导航栏组件中的徽标图像会加载到主页中而不是房间页面中?

主页如下:

const Home = () => {
return (
    <React.Fragment>
        <NavBar/>
        <Hero/>
        <Services/>
        <FeaturedRooms/>
        <Consultation/>
        <Footer/>
    </React.Fragment>
);
}
export default Home;

现在,房间页面是基本页面,仅以下内容:

const RoomPage = () => {
return (
    <React.Fragment>
        <NavBar/>
        <Footer/>
    </React.Fragment>
);
}
export default RoomPage;

徽标图像的路径为public / images / logo.png。我将src =“ images / logo.png”的徽标导入img作为导航栏组件中的样式组件。

主页和会议室页面都位于同一文件夹中:src / pages / home.js和src / pages / singleRoom.js

导航栏位于components文件夹中,如下所示:src / components / navbar.js