Infinite loading on Vue.js?

Question

JavaScript

I 'm using a ready-made Vue Plugin to implement infinite loading. According to the example from the documentation , everything works fine, but how to use it inside the module? Depending on the result, you need to execute $state.loaded()or $state.complete()and no matter how I try to do it inside the action, the result is negative.
ProductList.vue

<template>
    <div>
        <div v-for="product in products" :key="product.id">
            <img :src="product.image">
        </div>
        <infinite-loading @infinite="getProducts"></infinite-loading>
    </div>
</template>

<script>
    import InfiniteLoading from 'vue-infinite-loading';
    import { mapState, mapActions } from 'vuex'

    export default {
        components: {
            InfiniteLoading
        },
        computed: mapState({
            products: state => state.products.all
        }),
        methods: mapActions('products', [
            'getProducts'
        ])
    }
</script>

products.js

// initial state
const state = {
    page: 1,
    all: []
}

// getters
const getters = {}

// actions
const actions = {
    getProducts ({ commit }) {
        axios.get('/api/products', {
            params: {
              page: state.page,
            },
        }).then(({ data }) => {
            if (data.data.length) {
                // $state.loaded();
            } else {
                // $state.complete();
            }
        });
    }
}

// mutations
const mutations = {
    setProducts (state, products) {
        state.all = products
    },
}

export default {
    namespaced: true,
    state,
    getters,
    actions,
    mutations
}

Answer 1

And who will pass the argument to the function? :)

const actions = {
  getProducts({ commit }, $state) {
    // blah
    $state.loaded()
  }
}