useWatchedQuerySubscription()

function useWatchedQuerySubscription<ResultType, Query>(query): RefState<ResultType, Query>

A composable to access and subscribe to the results of an existing WatchedQuery instance.

Type Parameters

Type Parameter	Default type
ResultType	unknown
Query extends WatchedQuery<ResultType, WatchedQueryOptions, WatchedQueryListener<ResultType>>	WatchedQuery<ResultType, WatchedQueryOptions, WatchedQueryListener<ResultType>>

Parameters

Parameter	Type
query	Query

Returns

RefState<ResultType, Query>

Example

<script setup>
import { useWatchedQuerySubscription } from '@powersync/vue';

const { data, isLoading, isFetching, error} = useWatchedQuerySubscription(listsQuery);
</script>

<template>
   <div v-if="isLoading">Loading...</div>
   <div v-else-if="isFetching">Updating results...</div>

   <div v-if="error">{{ error }}</div>
   <ul v-else>
       <li v-for="l in data" :key="l.id">{{ l.name }}</li>
   </ul>
</template>