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

后端 未结 6 1679
生来不讨喜
生来不讨喜 2021-02-02 05:58

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

6条回答
  •  暖寄归人
    2021-02-02 06:30

    Update for Vue2

    I want to show some ways that you can work with data and not using filters as they are deprecated in Vue2:

    inside computed property

    Use computed properties in place of filters, which is much better because you can use that data everywhere in component, not only just in template: jsFiddle

    computed: {
        reverseItems() {
            return this.items.slice().reverse();
      }     
    }
    

    inside Vuex getter property

    If you're using Vuex, and you store your data in store.state object. The best way do some transformation with data stored in state is to do that in getters object (for example filtering through a list of items and counting them, reverse order and so on...)

    getters: {
        reverseItems: state => {
            return state.items.slice().reverse();
        }
    }
    

    and retrieve state from getters in component computed property:

    computed: {
        showDialogCancelMatch() {
            return this.$store.state.reverseItems;
        }
    }
    

提交回复
热议问题