将Laravel Resource API数据传递给Vue.js可以通过以下步骤实现:
php artisan make:resource YourResourceName
<?php
namespace App\Http\Resources;
use Illuminate\Http\Resources\Json\JsonResource;
class YourResourceName extends JsonResource
{
public function toArray($request)
{
return [
'id' => $this->id,
'name' => $this->name,
// 其他字段
];
}
}
use App\Http\Resources\YourResourceName;
public function index()
{
$data = YourModelName::all();
return YourResourceName::collection($data);
}
import axios from 'axios';
export default {
data() {
return {
items: []
};
},
mounted() {
axios.get('/api/your-endpoint')
.then(response => {
this.items = response.data.data;
})
.catch(error => {
console.log(error);
});
}
}
<template>
<div>
<ul>
<li v-for="item in items" :key="item.id">
{{ item.name }}
</li>
</ul>
</div>
</template>
这样,你就可以将Laravel Resource API数据传递给Vue.js,并在Vue组件中使用它们了。
关于腾讯云相关产品和产品介绍链接地址,由于要求不能提及具体品牌商,建议你访问腾讯云官方网站,查看他们的云计算产品和服务,以了解更多相关信息。
领取专属 10元无门槛券
手把手带您无忧上云