這篇文章主要介紹了react中怎么導入圖片,具有一定借鑒價值,需要的朋友可以參考下。希望大家閱讀完這篇文章后大有收獲。下面讓小編帶著大家一起了解一下。
react中導入圖片的方法:1、通過import方式導入,代碼為【import logo from './asset/logo.jpg'】;2、使用require方法,代碼為【<img src={require('../img/...】。
react中導入圖片的方法:
1、通過import方式(適用于插入靜態圖片):
import React from 'react' import logo from './asset/logo.jpg' export default class Login extends React.Component { render() { return (<> <img src={logo} alt="logo" /> </>) } }
2、使用require方法(可以使用此方法插入動態圖片):
<img src={require('../img/iconxx.png')} alt="" />
require中不能有純粹的代表圖片地址的變量,但是可以通過變量和字符串拼接的方式來使用此方法。
3、css中可以通過直接使用圖片地址的方式來引用圖片(和原生的一樣)。
感謝你能夠認真閱讀完這篇文章,希望小編分享react中怎么導入圖片內容對大家有幫助,同時也希望大家多多支持億速云,關注億速云行業資訊頻道,遇到問題就找億速云,詳細的解決方法等著你來學習!
免責聲明:本站發布的內容(圖片、視頻和文字)以原創、轉載和分享為主,文章觀點不代表本網站立場,如果涉及侵權請聯系站長郵箱:is@yisu.com進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。