useForesightEvent

This is meant for high-level, app-wide use cases (analytics, debugging, a global prediction counter), not per-element logic. useForesightEvent subscribes a component to the ForesightManager events. Pass the event name and a listener, and the composable adds and removes the listener for you.

<script setup lang="ts">
  import { ref } from "vue"
  import { useForesightEvent } from "@foresightjs/vue"

  const hits = ref(0)

  useForesightEvent("callbackInvoked", () => {
    hits.value++
  })
</script>

<template>
  <p>{{ hits }} prefetches triggered</p>
</template>

You don't need to remove the listener yourself, the composable does it for you when the component is disposed.

See Events for the full list of event names and their payloads.