Vue.js: How to use useIntersectionObserver from VueUse?

1<script setup>
2import { ref } from "vue"
3import { useIntersectionObserver } from "@vueuse/core"
4
5const target = ref(null)
6const isVisible = ref(false)
7
8useIntersectionObserver(target, ([entry]) => {
9    isVisible.value = entry?.isIntersecting ?? false
10})
11</script>
12
13<template>
14    <div ref="target">
15        <p>{{ isVisible ? "Visible" : "Hidden" }}</p>
16    </div>
17</template>