react中 如何使用图片

Posted 2021-03-13 alchemist-z

//render

第一种方法：先const一个对象，把需要应用图片的dom上的style写入对象中，

　　然后在return()中使用style关键字赋值为预先定义的那个style对象

const bgGround = {

    display:‘block‘,

    height: ‘600px‘,

    width:‘800px‘,

    background: `url( ${require("../image/notfound404.jpg")})`

}

return(

　　<div style = { bgGround }></div>

)

 

第二种方法：直接import imgUrl from "../image/notfound404.jpg"

　　然后return()中 直接使用img标签，将url赋值为imgUrl 

 

import imgUrl from "../image/notfound404.jpg"

return(

    <img url = {imgUrl}/>

)