使用Vue.js进行分页错误

时间:2017-10-19 18:05:55

标签: javascript vue.js

我收到了Cannot read property 'parentNode' of null

这是我的VUE.JS代码

Vue.http.headers.common['X-CSRF-TOKEN'] = $("#token").attr("value");

new Vue({

    el: '#manage-vue',

    data: {
        items: [],
        pagination: {
            total: 0,
            per_page: 2,
            from: 1,
            to: 0,
            current_page: 1
        },
        offset: 4/*,
         formErrors:{},
         formErrorsUpdate:{},
         newItem : {'title':'','description':''},
         fillItem : {'title':'','description':'','id':''}*/
    },

    computed: {
        isActived: function () {
            return this.pagination.current_page;
        },
        pagesNumber: function () {
            if (!this.pagination.to) {
                return [];
            }
            var from = this.pagination.current_page - this.offset;
            if (from < 1) {
                from = 1;
            }
            var to = from + (this.offset * 2);
            if (to >= this.pagination.last_page) {
                to = this.pagination.last_page;
            }
            var pagesArray = [];
            while (from <= to) {
                pagesArray.push(from);
                from++;
            }
            return pagesArray;
        }
    },


    ready : function(){
        this.getVueItems(this.pagination.current_page);
    },

    methods : {

        getVueItems: function(page){
            this.$http.get('https://olympikesoft.com/api/get/posts?page='+page).then((response) => {
                this.$set('items', response.data);
                this.$set('pagination', response.data.pagination);
            });
        },

        changePage: function (page) {
            this.pagination.current_page = page;
            this.getVueItems(page);
        }

    }

});

这是我的blade.view代码,用于检索刀片中的所有数据。

使用响应中的Json值。

<div class="container" id="manage-vue">

<div v-for="item in items" class="blog-item">


</div>

我在这里使用分页代码。

0 个答案:

没有答案