NuxtN
Nuxt11mo ago
4 replies
meowcat.32

nuxt ui inputmenu breaks tab behavior!

<script setup lang="ts">
const searchTerm = ref('');

const { data: items, status } = await useLazyFetch('/ac', {
  query: { query: searchTerm },
  $fetch: useNuxtApp().$api,
  transform: (data) => {
    return data.map((item) => ({
      label: item.name,
      value: item.id
    }));
  }
});
</script>

<template>
  <UInputMenu
    v-model:search-term="searchTerm"
    :items="items || []"
    :loading="false"
    ignore-filter
    placeholder="Start typing..."
  >
  </UInputMenu>
</template>

when i type something in and then press tab, it empties the search-tem so it queries the api for a empty string, which returns an empty array unfocusing the search results!
Was this page helpful?