How to write the correct syntax for backgroundImage in ReactJs?

user_12835997 0
Viewed 88

I'm trying to define a 's backgroundImage in a map() function but I can't understand what the correct syntax is to add one:

I have a variable named value that stores a file's name and I want to insert uploads/ in my backgroundImage because it's the folde where I want the backgroundImage to fetch the images.

I've tried:

<div className="image-show" key={index} style={{backgroundImage: URL({'uploads/' + value})}}>

But it returns the following error:

Error

Thanks in advance

reactjs javascript
4 Answers

You can try out :

style={{backgroundImage: "url(uploads/" + value + ")" }}

//OR

style={{backgroundImage: `url(uploads/${value})` }}
user_23494070

Replace: {'uploads/' + value}

with the following:

{ `uploads/${value}`}
user_27721180

Try this:

<div className="image-show" key={index} style={{backgroundImage: "url(uploads/" + value + ")" }}>

The general syntax is :

backgroundImage: "url(" + background_image + ")"   

--- where background_image is a string(path of  your image)
user_113623700

CSS style fields that you pass in components must have value in number or string.

Instead of style={ {backgroundImage: URL({uploads/12345})} }

React expects style={{backgroundImage: "url(uploads/12345)" }}

I hope that helps

user_57381620
Related