时间戳

首页 > 解决方案 > Vue组件不显示来自api的寄存器

vue.js - Vue组件不显示来自api的寄存器

问题描述

请帮助解决这个问题我正在尝试显示来自 api 路由 (/api/orders) 的寄存器当我从 axios 调用它们时，我使用 get petittion to /api/orders

这是我的方法：

listarOrdenesIngreso (page,buscar,criterio) {
    let me=this;
    var url= '/api/orders?page=' + page + '&buscar='+ buscar +'&criterio='+ criterio;
    axios.get(url)
        .then(function (response) {
            var respuesta= response.data;
            me.arrayOrders = respuesta.orders.data;
            me.pagination = respuesta.pagination;
            // handle success

         })
........

这是 API 路由 routes/api.php 文件

Route::resource('orders', 'EntryOrderController',['except' => ['create','edit']]);

这里是控制器的代码（EntryOrderController.php 文件）

public function index(Request $request) 
    { if (!$request->ajax()) return redirect('/');
     $entries = EntryOrder::all(); 
    //return response()->json(['data' => $entries], 200); 

    return $this->showAll($entries); 
}

在此处输入图像描述

问题如图 1 所示，我的 vue 组件中没有显示任何寄存器当我从浏览器中的 URL 调用它们时，正确地显示包含数据的数组。 在此处输入图像描述

我希望你能帮助我谢谢

标签： vue.jslaravel-5

解决方案

你的问题是请求结果数据不成立

 `listarOrdenesIngreso (page,buscar,criterio){
                let me=this;
                var url= '/api/orders?page=' + page + '&buscar='+ buscar + '&criterio='+ criterio;
                axios.get(url)
                    .then(function (response) {
                        me.pagination = response.pagination;
                        me.arrayOrders = response.data.data; // do this 
                    //me.arrayOrders = respuesta.orders.data; // errors here

                        // handle success

                    })

推荐阅读