CODEWITHSUNDEEP
vue.js
user15264932
user15264932

Reputation: 1

how do I route or connect the search filter to search in another component vue

I have two search components and I want to connect the search of the first with the search filter on the other component. How do I connect these two?

in the first component

<input type="text" class="searchTerm" placeholder="What are you looking for?" v-model="str" aria-label="Search" />
<button type="submit" class="searchButton" @click="$router.push('/internships')" @click.prevent="performSearch()">
   <i class="fa fa-search"></i>
</button>

In the second component

<form @submit.prevent="performSearch" class="search p-2 bg-2">
    <input type="text" class="searchTerm" v-model="str" placeholder="Search?"/>
    <button class="searchButton" type="submit">
        <i class="fa fa-search"></i>
    </button>

Upvotes: 0

Views: 693

Answers (1)

ElizabethSetton
ElizabethSetton

Reputation: 379

you can pass to your route query's and then fetch them from URL.

$router.push(path: 'internships', query: {searchText: 'str in your case'})

// Then for get the query from url: 

this.$route.query.searchText

Please read this for more information. https://router.vuejs.org/guide/essentials/navigation.html

Note: The user can edit the url between steps.

Upvotes: 1

Related Questions