React js image is blank in safari

Viewed 56

I'm developing a page in React js and I need to display a logo of the the company. I get the image url from the API response and if there is no image url returned I need to display a default logo (stored locally). I import the default logo the following way:

import defaultLogo from "../images/logo.png";

and set the logo from API response like this:

const [logo, setLogo] = useState();

// then I set the image url inside the API call function
setLogo(result.data.logo);

and display the logo in the component like this:

<img
alt="logo"
src={logo ? logo : defaultLogo}>
</img>

Everything is working in the webview and android (I can see API logo and default logo), but in safari defaultLogo is displayed as a blank image (only alt is visible). I can't seem to figire out what is the issue, any advise is greatly appericated.

0 Answers
Related