這篇文章將為大家詳細講解有關怎么在react頁面中引入本地圖片，小編覺得挺實用的，因此分享給大家做個參考，希望大家閱讀完這篇文章后可以有所收獲。

創(chuàng)新互聯(lián)公司是一家專業(yè)提供陽高企業(yè)網(wǎng)站建設,專注與成都網(wǎng)站建設、成都網(wǎng)站設計、H5場景定制、小程序制作等業(yè)務。10年已為陽高眾多企業(yè)、政府機構(gòu)等服務。創(chuàng)新互聯(lián)專業(yè)的建站公司優(yōu)惠進行中。

在react中引入本地圖片的兩種方式。

方式一、非背景圖片引入方式

（1）-直接在img標簽內(nèi)部src中使用

（2）import導入

import imgSrc from '圖片路徑'

方式二、圖片作為背景引入

（1）render()方法內(nèi)定義為對象

const bgGround {
    display: 'inline-block',
    height: '40px',
    width: '40px',
    background: `url(${require("圖片路徑")})`
}

// 在return中使用
xxxxx

（2）import引入

import imgUrl from '圖片路徑'
// render()中定義為對象
const bgGround = {
    display: 'inline-block',
    height: '40px',
    width: '40px',
    backgroundImage: 'url(' + imgUrl + ')'}
//在return中使用
xxxxx

關于“怎么在react頁面中引入本地圖片”這篇文章就分享到這里了，希望以上內(nèi)容可以對大家有一定的幫助，使各位可以學到更多知識，如果覺得文章不錯，請把它分享出去讓更多的人看到。