generated from Seekra/repository-template
Show search bar below the navbar on the search results view on small screens #99
@@ -17,14 +17,27 @@ limitations under the License.
|
|||||||
<script setup>
|
<script setup>
|
||||||
import Searchbar from '@/features/search/components/Searchbar.vue';
|
import Searchbar from '@/features/search/components/Searchbar.vue';
|
||||||
|
|
||||||
|
import { watch } from 'vue';
|
||||||
import { useRoute } from 'vue-router';
|
import { useRoute } from 'vue-router';
|
||||||
|
|
||||||
const route = useRoute();
|
const route = useRoute();
|
||||||
|
const searchQueryModel = defineModel();
|
||||||
|
|
||||||
|
watch(() => route.name, name => {
|
||||||
|
searchQueryModel.value = name === 'searchResults' ? route.query.q || '' : '';
|
||||||
|
});
|
||||||
|
|
||||||
|
watch(() => route.query.q, q => {
|
||||||
|
if (route.name === 'searchResults') {
|
||||||
|
searchQueryModel.value = q || '';
|
||||||
|
}
|
||||||
|
});
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<Searchbar
|
<Searchbar
|
||||||
v-if="route.name === 'searchResults'"
|
v-if="route.name === 'searchResults'"
|
||||||
|
v-model="searchQueryModel"
|
||||||
auto-submit
|
auto-submit
|
||||||
/>
|
/>
|
||||||
</template>
|
</template>
|
||||||
Reference in New Issue
Block a user