0

So currently I am using this bit of code inside my components to load a placeholder image if the main one does not load.

<img
  src={image ? image : 'images/placeholder-image.png'}
/>

And this works fine, however I have to set this for each img tag I use. So I was wondering if anyone knew of a way to globally (for every img tag in a project) set a default image that would load in case there was an error loading the main image?

Bobert Ross
  • 77
  • 7
  • 2
    Create a custom image component and use it instead of regular old `img`. – brc-dd Oct 28 '21 at 12:28
  • 2
    Does this answer your question? [What is the best way to have a fallback image in NextJS?](https://stackoverflow.com/a/66953317) -- set a default value of `fallbackSrc` in that answer so that you don't have to explicitly write it each time. – brc-dd Oct 28 '21 at 12:29
  • Yes these are both great answers, thank you! I will update the question with the answer soon. – Bobert Ross Oct 28 '21 at 13:33

0 Answers0