How do I reverse the order of an array using v-for and orderBy filter in Vue JS?

Question

I am using Vue JS to do viewmodel bindings. In my data object I have an array of items that are sorted in ascending order (oldest to newest) and I\'d like to keep i

Answer 1

Note: The below works in Vue 1, but in Vue 2 filters are deprecated and you will see: ' Property or method "reverse" is not defined on the instance but referenced during render.' See tdom_93's answer for vue2.

You could create a custom filter to return the items in reversed order:

Vue.filter('reverse', function(value) {
  // slice to make a copy of array, then reverse the copy
  return value.slice().reverse();
});

Then use it in the v-for expression:

https://jsfiddle.net/pespantelis/sgsdm6qc/