我有一个问题，在刷新时，一些媒体会消失(bg图像+徽标(。背景图像继承自HTML，徽标继承自导航栏组件。
此链接位于某个类别上，刷新时工作正常。
https://alphamedical.netlify.app/ATI
如果你点击该类别中的一个项目，然后刷新，bg和徽标就会消失。https://alphamedical.netlify.app/ATI/HAMILTON-C1
例如上面的链接。
我认为这可能与react路由器有关。
我的应用程序路由
function App() {
const customHistory = createBrowserHistory();
return (
<Router history={customHistory}>
<div>
<Navbar />
<Routes>
<Route path="/" exact element={<Home />} />
<Route path="/:title" element={<ProductList />} />
<Route path="/:title/:product" element={<ProductPage />} />
</Routes>
</div>
</Router>
);
}
背景图像所在的HTML代码：
</head>
<style>
html {
scroll-behavior: smooth;
overflow: scroll;
overflow-x: hidden;
background: url(images/gradient.jpg) no-repeat center center fixed;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
}
</style>
<body class="text-white" style="font-family: 'Inter', sans-serif; font-weight: 500">
<div id="root"></div>
</body>
</html>
确保在路由时媒体路径始终匹配。
Forhttps://alphamedical.netlify.app/ATI样式可以正确地找到背景图像路径。但对于https://alphamedical.netlify.app/ATI/HAMILTON-C1背景图像路径错误。它需要
background: URL(../images/gradient.jpg) no-repeat center center fixed;
而不是
background: url(images/gradient.jpg) no-repeat center center fixed;
解决方案：创建一个样式表文件。并将其导入您的App.jsx文件
我有一个带有src="徽标.png"；，当我在任何页面上路由时(路径="*"(。我的图像被检查为alt名称。。。所以我只是把我的src改成src="徽标.png"；，它的工作原理是