Vue分页错误：未定义响应

Question

我不断收到这个 Vue 错误：“ReferenceError: response is not defined” 但是当我在控制台中检查时，数据就在那里。

我打算使用响应中的数据进行分页。提前致谢。

方法

getAllUserData(){
    let $this=this;
    axios.get('api/members/getAllMembersData').then(response=>this.members=response.data.data);
    $this.makePagination(response.meta,response.links);
},

makePagination(meta,links){
    let pagination={
    current_page:meta.current_page,
    last_page:meta.last_page,
    next_page_url:links.next,
    prev_page_url:links.prev
    }
    this.pagination = pagination;
}

Answer 1

axios.get() 是一个异步函数。在 ajax 请求完成后，该函数后面的代码将不会执行，但在此之前很久。因此，变量response 还不存在。

所有需要在ajax调用完成时执行的代码都必须放在调用的.then()函数中。

getAllUserData(){
    axios.get('api/members/getAllMembersData').then(response => {
        this.members = response.data.data;
        this.makePagination(response.data.meta, response.data.links);
    });
},

Answer 2

您的响应仍在 axios get 方法中，因此也必须在 axios 方法中调用 makePagination 函数（在 .then() 中）

getAllUserData(){
    let $this=this;
    axios.get('api/members/getAllMembersData').then(response=>
    this.members=response.data.data
    $this.makePagination(response.data.meta,response.data.links);
},

makePagination(meta,links){
    let pagination={
    current_page:meta.current_page,
    last_page:meta.last_page,
    next_page_url:links.next,
    prev_page_url:links.prev
    }
    this.pagination = pagination;
}