подскажите как правильно достать в компоненте поле из связанной таблицы?
У меня есть контроллер ProductController - в котором функция index() - отображает все товары
public function index()
{
$product = Product::latest()->paginate(10);
$product->load('categories');
return response()->json($product);
}
Есть модель Product - в которой связь
public function categories(){
return $this->belongsTo(Category::class);
}
И есть Component - в который передаются данные
data() {
return {
products: {},
form: new Form({
id : '',
title : '',
image : '',
category_id : '',
price : '',
description : '',
})
}
},
methods: {
loadProducts(){
axios.get('api/products')
.then(({ data }) => (this.products = data.data ));
},
}
И на выходе я перебираю объект - products
<tr v-for="product in products" :key="product.id">
<td>{{product.id}}</td>
<td>{{product.title | upText}}</td>
<td>{{product.price}}</td>
<td>{{product.category_id}}</td>
<td>{{product.description}}</td>
<td>{{product.image}}</td>
<td>{{product.created_at | myDate}}</td>
<td><span class="tag tag-success">
<a href="#" v-on:click="editModal(product)"><i class="fa fa-pen">Edit</i></a>
</span></td>
<td><span class="tag tag-success">
<a href="#" v-on:click="deleteProduct(product.id)"><i class="fa fa-trash">Delete</i></a>
</span></td>
</tr>
Как мне через связь categories - получать Имя категории, вместо - {{product.category_id}}
И очень странно, что я когда приходит объект - у меня пустые categories - null?
categories: null
category_id: 45 created_at: "2021-03-17T07:18:58.000000Z" description: "Name" id: 1 image: null price: "500" slug: "slug" title: "Name" updated_at: "2021-03-17T07:18:58.000000Z"