107
Gatsby: img is a void element tag and must neither have `children` nor use `dangerouslySetInnerHTML`
rated 0 times
[
110]
[
3]
/ answers: 1 / hits: 22689
/ 5 Years ago, wed, july 17, 2019, 12:00:00
I am trying to build a component with Gatsby Js that includes a image that is imported. However when a link is added with the anchor HTML tag, I am receiving img is a void element tag and must neither have
childrennor use
dangerouslySetInnerHTML`.
Without <a> ... </a>
there is no such error.
My code:
import React from react
import medium from ../images/medium.png
const Socials = () => (
<div>
<a href=https://medium.com> <img src={medium}> </img> </a>
</div>
)
export default Socials
Stack trace:
in img (at Socials.js:8)
in a (at Socials.js:8)
in div (at Socials.js:7)
in Socials (at pages/index.js:44)
in IndexPage (created by HotExportedIndexPage)
in AppContainer (created by HotExportedIndexPage)
in HotExportedIndexPage (created by PageRenderer)
in PageRenderer (created by JSONStore)
in JSONStore (created by RouteHandler)
in RouteHandler (created by EnsureResources)
in div (created by FocusHandlerImpl)
in FocusHandlerImpl (created by Context.Consumer)
in FocusHandler (created by RouterImpl)
in RouterImpl (created by Context.Consumer)
in Location (created by Context.Consumer)
in Router (created by EnsureResources)
in ScrollContext (created by EnsureResources)
in RouteUpdates (created by EnsureResources)
in EnsureResources (created by LocationHandler)
in LocationHandler (created by LocationProvider)
in LocationProvider (created by Context.Consumer)
in Location (created by Root)
in Root
in _default
What is the correct way to add an URL link to an image?
More From » html