how to call a function with onclick in AMP page

Question

Trying to call fetch api, on press of an image, it looks I checked AMP events docs but cant help..

amp content looks like below;

  const callFetchAPI = () => {
    fetch('https://preview.amp.dev/static/samples/json/examples.json').then(
      (response) => response.json()
    )
  }
return (
                <a
                  target="_blank"
                  on="tap:callFetchAPI"
                  href="https://yahoo.com"
                >
                  <amp-img
                    role="button"
                    tabIndex={0}
                    id="clickEvent"
                    width="320"
                    height="150"
                    src={myurl}
                    alt=""
                    className="w-100"
                    layout="responsive"
                  />
                </a>

how to trigger that function above on press?

Answer 1

ON Tab not able to clickable

{
  "content": "<div class="locked-msg-outer"><div class="mm-container"><div class="locked-msg-container subplan-container"><div class="locked-msg-container-in subplan-container-in"> <div class="locked-container-title">title </div><p class="locked-container-sub">title<p><div class="locked-btn-wrp" **on="tap:amp-access.login-ampArtileAccess-sign-in"** role="button" tabindex="0"><div class="btn btn-red ssoevksign-up">Login</div></div> </div> </div></div> <div class="locked-msg-overlay"></div></div>"
}