3

I would like to keep a list of data before another up coming list of data replaced. I'm using this plugin in my vuejs project: https://peachscript.github.io/vue-infinite-loading to loading more data.

Scenario:

  1. Reload to get list of data by calling loading more handler function
    • do an action requests in Vuex and store in a state
    • list data from Vuex state
  2. Filter another data and list
    • keep the previous list of data while another upcoming for replacing

Keep current list of data before replace by up coming list of data

Currently, I get data from loading more handler function by reset data list to null to get new data that's why My list of data is blank.

    computed: {
    ...mapGetters({
      lists: ['user/list']
    })
  },
 methods: {
    onLoadMoreLists($state) {
      this.$store.dispatch('user/list').then((data) => { 
          if (data.items.length > 1) {
            this.pages.page++
            $state.loaded()
          } else {
            $state.complete()
          }
        })
    }
}

    // table and infine
    <the-table
          :lists="lists"
        >
          <infinite-loading
            :identifier="infiniteId"
            spinner="spiral"
            @infinite="onLoadMoreLists"
          >
            <div slot="spinner">
              <st-loading></st-loading>
            </div>
            <div slot="no-more">No more data</div>
            <div slot="no-results">No results message</div>
          </infinite-loading>
        </the-table>
CHHUM Sina
  • 435
  • 5
  • 13

1 Answers1

0

I use this to solve issue:

this.$refs.infiniteloading.stateChanger

ref="infiniteloading"

CHHUM Sina
  • 435
  • 5
  • 13