I have a search page and a results page. When I’m in the search page, I have various parameters I can modify to look in a list of users, and when I click on the “Search” button, it will push the list of users found into the vue store, and send me to the results page. This page lists all the users it was able to find in a v-data-table that’s separated in columns for each attribute. Since there’s a bunch of data, the list is separated in pages of 15 users, and only loading the data for those 15 users. When clicking on next page, it loads the next data lot of 15 users, and so on. The rest of the users only have their id available.

The problem comes when I want to sort by a certain column (e.g. the name of the user), since the list of the users only has the info loaded for the 15 users at the beginning, I have no real way to sort the data in this context, since there isn’t any at all other than the userId.

The solution I had in mind was to redo the same search that was made in the search page, but with an additional parameter consisting of the sorting information. The problem is that I only have access to the user list, located in the store, and none of the parameters or function call that are necessary to perform the search operation since I no longer have access to them. Is there a way to get access to all the search parameters that were used to perform the search in vuejs?

Here’s a snippet of the search code

searchUser({...searchRequest})
.then(users => {
    dispatch('convertUser', { users }) // loads the info for the first 15
    .then(convertedUsers => {
        commit("SET_REQUEST_RESULT", convertedUsers)
    })
.finally(() => {
    resolve()
    router.push({ name: 'SearchResults'}).catch(()=>{})
})



Source link

Leave a Reply

Your email address will not be published. Required fields are marked *