app/pages/poc.vue

<template>
  <div class="pa-8">
    <h1>POC</h1>

    <v-text-field v-model="searchFilter" />

    <ul v-if="!pending && data !== null">
      <li v-for="organization in data.items" :key="organization.id">
        {{ organization.name }}
      </li>
    </ul>
    <span v-else>Loading...</span>
  </div>
</template>

<script setup lang="ts">
import { useEntityFetch } from '~/composables/data/useEntityFetch'
import Query from '~/services/data/Query'
import Search from '~/services/data/Filters/Search'
import Subdomain from '~/models/Organization/Subdomain'

const { fetchCollection } = useEntityFetch()

const query = new Query()

const searchFilter = ref('2io')

query.addWhere(new Search('subdomain', searchFilter.value))

const { data, pending } = fetchCollection(Subdomain, null, query)
</script>

<style scoped lang="scss">
h1 {
  color: rgb(var(--v-theme-primary));
}
</style>