类星体框架数据表laravel服务器分页不起作用

时间:2018-06-19 09:56:30

标签: laravel-5 vuejs2 quasar-framework

我只想让数据表分页起作用,我在文档中使用的代码是:

request ({ pagination }) {
            // we set QTable to "loading" state
            this.loading = true

            // we do the server data fetch, based on pagination and filter received
            // (using Axios here, but can be anything; parameters vary based on backend implementation)

            axios
                .get(`/api/`+this.dataSource+`/?page=${pagination.page}`,{ headers: { Authorization: 'Bearer '.concat(localStorage.getItem('token')) } })
                .then(response => {
                    // updating pagination to reflect in the UI
                    this.serverPagination = pagination

                    // we also set (or update) rowsNumber
                    this.serverPagination.rowsNumber = response.data.data.data.rowsNumber

                    // then we update the rows with the fetched ones
                    this.tableData = response.data.data.data

                    // finally we tell QTable to exit the "loading" state
                    this.loading = false
                })
                .catch(error => {
                    // there's an error... do SOMETHING

                    // we tell QTable to exit the "loading" state
                    this.loading = false
                })
        }

并在laravel api中使用此代码

`/api/`+this.dataSource+`/?page=${pagination.page}`,{ headers: { Authorization: 'Bearer '.concat(localStorage.getItem('token')) } }

它会返回第一页的数据,但数据表的箭头按钮被禁用,尽管存在其他数据。

提前致谢

1 个答案:

答案 0 :(得分:2)

我找到了解决方案的地方

request ({ pagination }) {
            this.loading = true
            axios
            .get(`/api/`+this.dataSource+`?page=${pagination.page}`, { headers: { Authorization: 'Bearer '.concat(localStorage.getItem('token')) } })
            .then(({ data }) => {
                this.serverPagination = pagination
                this.tableData = data.data.data
                this.serverPagination.rowsNumber = data.data.total
                this.loading = false
            })
            .catch(error => {
                // there's an error... do SOMETHING
                console.log(error)
                // we tell QTable to exit the "loading" state
                this.loading = false
            })
        }

在控制器中:

$any_data = $this->dataRepo->paginate(5);