从 ParkingArea 表 Laravel vue 中的类别 ID 获取类别名称

Question

嗨，需要帮助的人，我有点困惑，我有一个类别表，我有一个停车区表，我想在列出停车区时显示类别 ID 中的类别名称，

在我的停车区模型中

    public function category(){
        return $this->belongsTo(Category::class);
    }

我也是从我的parkingArea 控制器中获取的，比如

 public function parkingData()
    {
        return ParkingArea::with(['category'])->orderBy('id', 'desc')->get();
    }

在我的 Area.vue 文件中

loadParkingArea(){
                 axios.get("api/parkingArea").then(({ data }) => (this.parkingArea = data));  
                 console.log(this.data)
               
            },

我正在迭代

 <tr v-for="Area in parkingArea.data" :key="Area.id">
                                <td> {{Area.category_id->name}} </td>
                                <td> {{Area.location}}</td>
                                <td>{{Area.capacity}}</td>
                            </tr>

请帮忙（发展）

Answer 1

大家好，已经超过 17 天了，我认为这还没有答案，所以我以这种方式解决了它

1. 建立适当的关系 - 在我的 category.php 中，我使用的是 belongsto 而不是 hasMany

public function parkingArea()
    {
        // return $this->belongsTo(ParkingArea::class);
        return $this->hasMany(\App\ParkingArea::class);
    }

也在 ParkingArea.php 中

public function category(){
        return $this->belongsTo(\App\Category::class);
    }

一旦完成.. 我所要做的就是在我的 vue 文件中，因此我获取了我的数据

 loadParkingArea(){
                 axios.get("api/parkingArea").then(({ data }) => (this.parkingArea = data));  

               
            },

我这样迭代来获取类别的名称

  <tr v-for="Area in parkingArea.data" :key="Area.id">
    <td> {{Area.category.name}} </td>
    <td> {{Area.location}}</td>
    <td>{{Area.capacity}}</td>
  </tr>

谢谢，我希望这对需要它的人有所帮助-Developia

Answer 2

您的 axios 响应将其存储在变量 data 中，因此在您的分配中

this.parkingArea = data 应该是this.parkingArea = data.data

或在您的迭代中

v-for="Area in parkingArea.data.data"

尝试并评论