如何使用interiajs从控制器返回数据

Question

这是我的productController

public function index()
{
  return Product::all();
}

方法

我正在寻找一种从惯性请求中返回此方法的

Route::get('/', function () {
  return Inertia::render('App', [ProductController::class, 'index']);
});

这是我的vue组件（不是我试图获取数据的方式的确切方式）

<template>

</template>

<script>
props: {
  index: Array,
},
</script>

Answer 1

在您的控制器中，您可以将产品列表传递给组件：

public function index()
{
  return Inertia::render('App', [
    'products' => Product::all()
  ]);
}

doc： https://inertiajs.com/responses

然后声明您的路线如：

Route::get('/products', [ProductController::class, 'index']);

这将创建/products路由，该路由将指向您的控制器的索引操作，该操作将将产品列表返回到您的组件。

在您的组件中，您可以访问产品：

<template>
  <div>
    {{ products.length }}
  </div>
</template>

<script>
props: {
  products: Array,
},
</script>