在Laravel Vue中调试数据

Question

我正在尝试从第3个表格中获取项目的数据，但是我没有成功。

逻辑

在项目单页中（我在其中显示每个项目的说明），我获得了该项目的ID，并根据该ID来计算总出价并显示出价者信息。

示例

Project 1

Bids: 50

Bidders: john, Alex, .....

我得到的东西

1. 视图中没有数据

2. 控制台错误

   方法“ biders”已被定义为数据属性。

代码

script

data(){
   return {
       project : [],
      //other data....
      biders:[], //my biders
      new_biders:'', //add new bidder info
  }
},
mounted() {
  // get logged user info
},
beforeMount(){
  let url = `/api/projects/${this.$route.params.slug}`
  axios.get(url).then(response => {
       this.project = response.data;
       Vue.nextTick(function () {
       $('[data-toggle="tooltip"]').tooltip()
      });
   });

   //user info
 },
methods: {
  // getting bids and bidders info from database
  biders() {
    axios.post('/api/projectbids/'+this.project.id)
         .then(res => {
          _.forEach(res.data, function(item){
            this.biders.push(item);
          })
    })
    .catch(error => {
       console.log(error.response)
    });

    // adding new bidder by pusher
    Echo.private('newbidplaced.'+this.project.id)
        .listen('NewBider', (e) => {
        this.biders.push(e.bider);
        alert(e.bider);
        // this.biders.push(e);
     });
   }
}

component

Total Bids {{biders.length}}

<div class="col-md-2 col-sm-6 col-xs-6 mb-3 text-center" v-for="bider in biders" :key="bider.id">
{{bider.name}
</div>

controller

public function projectbids($id){
        $biders = DB::table('projects')
        ->where('projects.id', '=', $id)
        ->join('bids','bids.project_id','=','projects.id')
        ->join('users','users.id','=','bids.user_id')
        ->join('profiles','profiles.user_id','=','users.id')
        ->select('bids.*','users.name','profiles.photo')
        ->get();
        return response()->json($biders, 200);
        event(new NewBider($biders));
}

route

Route::post('/projectbids/{id}', 'Api\ProjectController@projectbids');

问题

1. 为什么我无法获得我的竞标者信息？
2. 我在哪里弄错了？
3. 如何调试数据以查找问题的一部分？

有什么主意吗？