Vue组件向Laravel控制器传值失败，请求数据为空如何解决？

1. 路由参数不匹配 #

你的API请求URL是party/${partyId}/projects/entries，但Laravel路由里没有party/{partyId}的前缀，控制器方法里的Party $party依赖注入会找不到对应的路由参数，导致请求无法正确映射到控制器方法，同时$party实例也无法正常获取。

修复路由 #

修改api.php中的路由分组，添加party/{party}前缀以匹配请求URL：

Route::group([
    'prefix' => 'party/{party}/projects'
], function($router) {
    Route::get('/statuses', [ProjectController::class, 'getStatuses']);
    Route::delete('/delete', [ProjectController::class, 'manyDelete']);
    Route::get('/entries', [ProjectController::class, 'getEntries']);
});

2. GET请求传递复杂数据的限制 #

GET请求的参数通过URL query字符串传递，存在两个核心问题：

• Axios的GET请求不支持data参数，该参数仅用于POST/PUT等带请求体的请求，你最初的写法从根源上就无法传递数据；
• 直接传递对象数组作为params时，Axios的默认序列化格式Laravel无法正确解析为可用的对象数组。

方案1：改用POST请求（推荐，适配复杂数据） #

因为你要传递的是对象数组，用POST请求更合适，能避免URL长度限制和序列化问题：

修改API方法

getEntries(partyId, projects) {
  return $axios.post(`party/${partyId}/projects/entries`, { projects });
},

组件调用保持原有写法

async getEntries() {
  try {
    this.projectEntries = await this.$API.projects.getEntries(
      this.currentPartyId,
      this.selectedItems,
    );
  } catch (e) {
    console.error(e);
    this.$toast.error(e.response.data.message);
  }
},

修改路由为POST类型

Route::post('/entries', [ProjectController::class, 'getEntries']);

控制器逻辑不变

此时$request->projects可以正确获取到前端传递的对象数组，后续遍历逻辑无需修改。

方案2：继续用GET请求，优化数据传递 #

如果必须使用GET，建议提取对象数组中的ID字段（因为控制器仅需要ID查询项目），简化传递的数据结构：

修改组件调用，提取项目ID数组

async getEntries() {
  try {
    const projectIds = this.selectedItems.map(item => item.id);
    this.projectEntries = await this.$API.projects.getEntries(
      this.currentPartyId,
      { projectIds },
    );
  } catch (e) {
    console.error(e);
    this.$toast.error(e.response.data.message);
  }
},

修改API方法

getEntries(partyId, params) {
  return $axios.get(`party/${partyId}/projects/entries`, { params });
},

修改控制器逻辑

public function getEntries(Request $request, Party $party): JsonResponse
{
    $entries = [];
    $projectIds = $request->input('projectIds');
    
    foreach ($projectIds as $id) {
        $project = Project::findOrFail($id);
        $entries[$project->id] = $project->workLog();
    }

    return response()->json([
        'data' => $entries
    ], Response::HTTP_OK);
}

3. 额外优化建议 #

• 控制器中添加参数存在性检查，避免空指针报错：

  if (!$request->has('projects') && !$request->has('projectIds')) {
      return response()->json(['message' => '缺少项目参数'], 400);
  }
  

• 使用POST请求时，可添加请求验证确保数据合法性：

  $validated = $request->validate([
      'projects' => 'required|array',
      'projects.*.id' => 'required|integer|exists:projects,id'
  ]);
  

内容的提问来源于stack exchange，提问作者Robert Juszczyński