How to sort particular array position based on the Id in Vuejs?

Viewed 199
<div v-for="(item, index) in gr" 
:key="space.id"
class="val-name">
</div>

I have done that logic using the below few line changes in the api call, like

with that, what i am trying to achieve finally i got it. But issue is, i cant expect the array value same all the time. So i have decided to re-arrange the array values based on the ID.

2 Answers

orderMap would be your desired index outcome.

array would be your API response.

map orderMap with a function that finds the desired index and places it in our sorted array.

const orderMap = ['third', 'second', 'first'];

const array = [{name: 'first'}, {name: 'second'}, {name: 'third'}];

let sorted = orderMap.map(function(sortBy){
  return this.find(function(toSort){return toSort.name === sortBy})
}, array)

console.log(sorted);

// as method -> Result is your response Data. OrderMap the map to order by. 
sortResultSet(result, orderMap) {
  return orderMap.map(function(sortBy){
    return this.find(function(toSort){return toSort.name === sortBy})
  }, result)
}

You could write a custom sorting function so it sorts them according to your needs. For eg:

function Sort(item1, item2){
  if (item1.name > item2.name)
    return 1;
  else if (item1.name < item2.name)
    return -1;
  else 
    return 0;
}

And then call it on the array

array.sort(Sort);
console.log(array);

If you want to you can omit the function declaration and just pass function as a parameter.

array.sort(function (item1, item2) {
  <same code from above>
});

And then just add it to the desired object from Vue

Related