已解決430363個問題，去搜搜看，總會有你想問的

如何在背景圖像css文件上正確寫入react 17.0.1？

首頁猿問如何在背景圖像css文件上正確寫入...

如何在背景圖像css文件上正確寫入react 17.0.1？

JavaScript

慕無忌1623718 2023-07-20 14:31:26

這是我嘗試過的 3 個選項.bg { background-image: url("/images/icons/courier.png")}.bg { background-image: url("./images/icons/courier.png")}.bg { background-image: url("../images/icons/courier.png")}icon is located: /public/images/icons/... 請參閱此處了解更多詳情給出這個錯誤：./src/components/header/header.css (./node_modules/css-loader/dist/cjs.js??ref--5-oneOf-4-1!./node_modules/postcss-loader/src??postcss !./src/components/header/header.css) 錯誤：無法解析“E:\New project\yamboo\src\components\header”中的“/images/icons/courier.png”前面這段代碼 -->.bg { background-image: url("/images/icons/courier.png")}在 React 版本 16.13.1 中工作正常請幫忙，我將不勝感激！提前致謝?。?！

查看完整描述

2 回答

滄海一幻覺

TA貢獻1824條經驗獲得超5個贊

暫時我已經通過將“package.json”文件中的“react-scripts”版本更改為3.4.4來解決該問題。

反對回復 2023-07-20

一只萌萌小番薯

TA貢獻1795條經驗獲得超7個贊

const divStyle = {

color: 'blue',

backgroundImage: 'url(' + imgUrl + ')',

};

function HelloWorldComponent() {

return <div style={divStyle}>Hello World!</div>;

}

style 屬性接受具有駝峰命名屬性的 JavaScript 對象，而不是 CSS 字符串。這與DOM風格的JavaScript屬性一致，效率更高，并且可以防止XSS安全漏洞。

import React from "react";

import hcbgImage from "./hcbg.jpg";

function App() {

return (

<div

class="bg_image"

style={{

backgroundImage: 'url('+hcbgImage+')',

backgroundSize: "cover",

height: "100vh",

color: "#f5f5f5"

}}

</div>

);

}

export default App;

在上面的示例中，我們導入圖像并將其路徑存儲在名為 hcbgImage 的變量中。如果我們通過控制臺記錄該變量，我們會得到類似 /static/media/hcbg.d1e1f550.jpg 的內容。這是React.js 的圖像路徑。

反對回復 2023-07-20

2 回答
0 關注
177 瀏覽

關注

添加回答

舉報

0/150

提交

取消

亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

熱搜

最近搜索清空

如何在背景圖像css文件上正確寫入react 17.0.1？

如何在背景圖像css文件上正確寫入react 17.0.1？

2 回答

添加回答

如何在背景圖像css文件上正確寫入react 17.0.1？