CODEWITHSUNDEEP
reactjsimageurlstate
Lindsay E
Lindsay E

Reputation: 19

How to get image url of image clicked in react

I am using React. I want my user to click on one of four images, then get the url of the image they clicked on. Right now, I am getting a url of the domain, path, and image together with e.target.src (http://localhost:3000/img/cat.png). How can I just get the image url (cat.png)?

Here is part of my code:

        this.setState({
            urlClicked: e.target.src
        });
        console.log(this.state.urlClicked)
      }

      <img 
         src={this.state.urlClicked}>
      </img>

Thanks so much.

Upvotes: 0

Views: 743

Answers (1)

Eliya Cohen
Eliya Cohen

Reputation: 11478

You can split the string by "/" and then pop (from the end) the first value:

this.setState({
  urlClick: e.target.src.split("/").pop()
});

Upvotes: 1

Related Questions