list not render after vuex state set to empty

[czjge]

I'm using this repository to build my blog with vuex, but I got a problem: a vuex state set to empty, and I change that state to none-empty, the problem comes, the list can't be rendered, but the page links can be rendered. I check the api and the state, both are ok. now I'm pretty sure the problem is the view render. Here is the code:

<template>
    <div>
        <ul class="list-group" style="margin-left: -40px;">
            <paginate
                    name="articles"
                    :list="lists"
                    :per="2"
            >
                <li class="list-group-item"
                    v-for="row in paginated('articles')">
                    <router-link :to="{path:'/' + row.id}" class="text-muted lead">
                        {{ row.title }}
                    </router-link>
                    &nbsp;&nbsp;&nbsp;
                    <span class="small text-muted">Posted&nbsp;{{ row.created }}</span>
                </li>
            </paginate>
        </ul>
        <paginate-links
                for="articles"
        >
        </paginate-links>
    </div>
</template>

<script>
    import { mapState, mapActions } from 'vuex';

    export default {
        name: "PostCategory",
        computed: mapState({
            lists: state => state.post.categories
        }),
        watch: {
            lists: function () {
                console.log(this.lists)
            }
        },
        created() {
            var cate_id = this.$route.params.cate_id;
            this.getPostCategory(cate_id);
        },
        beforeRouteUpdate (to, from, next) {
            // react to route changes...
            // don't forget to call next()
            var cate_id = to.params.cate_id;
            this.getPostCategory(cate_id);
        },
        methods: {
            ...mapActions([
                'getPostCategory'
            ])
        },
        data () {
            return {
                paginate: ['articles'],
            }
        }
    }
</script>

[mrodrig]

I'm running into a similar issue without VueX. I have an array of objects and if the array is filtered down to an empty list when a user searches on specific text, then the paginated(...) function will always return an empty list, even if the search term changes back to something that previously returned several results.

[jchamb]

@czjge @mrodrig I'm not sure this is being maintained anymore since it hasn't been updated in over a year. There was a pull request that fixes this #99 I created my own fork to apply the patch to fix it.

you can do the same in your own fork for the time being or for a quick work around change your package to hit mine.

In package.json "vue-paginate": "git+ssh://[email protected]:jchamb/vue-paginate.git#v3.6.1"

[mikerogne]

Thanks, fixes it for me!

[shequet]

Thank you for your correction, it works great