score:0

Accepted answer

so my issue is that i do not know how a user can download all the images by clicking on a link.

given that scenario, i would recommend avoiding the link component, since doesn't fit your requirements.

i would do something like:

  <button onclick={downloadallitems}>download</button>

then, in your function:

  const downloadallitems=()=>{
    data.allstrapilogos.nodes.foreach(node=> window.open(`/yoursite.com/${node.image.localfile.publicurl}`))
  }

modified from:

add an event.preventdefault before the loop if the button is inside a form to avoid unwanted requests if needed.

given your use-case, i think is the more intuitive approach to download all items in one-click function.

you can bypass browser's (or adblock's) limitation by setting the window.open and save the memory reference and setting the location on the callback:

let newwindow=window.open(...)

then:

newwindow.location=`/yoursite.com/${node.image.localfile.publicurl}`

Related Query

More Query from same tag