Laravel vuejs put 方法未正确提交数据

Question

我有一个 vuejs 方法，我使用 axios 更新记录，但 laravel 端的数据为空。 我是 vuejs 新手，createMember 方法正在使用 axios.post 工作，但 axios.put 未按预期工作。如果我直接传递值数组，它可以工作，但不会上传图像。 vuejs方法

  const formData = new FormData();
  formData.append("full_name", values.full_name);
   
  if (values.email) {
    formData.append("email", values.email);
  }
  if (values.address) {
    formData.append("address", values.address);
  }
  if (values.image) {
    formData.append("image", values.image);
  }

  axios
    .put("/api/members/" + formValues.value.id, formData)
    .then((response) => {
      const index = members.value.data.findIndex((member) => {
        return member.id == response.data.id;
      });

      members.value.data[index] = response.data;
      $("#memberFormModal").modal("hide");
      resetForm();
      toastr.success("Member updated successfully");
    })
    .catch((error) => {
      console.log(error);
      if (error.response.data.errors) {
        setErrors(error.response.data.errors);
      }
    });
};

Laravel 路线

Route::put('api/members/{member}', [MemberController::class, 'update']);

Laravel Controller 方法

 public function update(Request $request, Member $member)
    {

        dd($request->all()); // returning emtpy array
        $request->validate([
            'full_name' => 'required|string|max:75',
            'email' => 'nullable|email|max:255',
            'address' => 'nullable|string|max:120',
            // 'image' => 'nullable|image|mimes:jpeg,jpg,png|max:2048'
        ]);

        $member->full_name = $request->full_name;
        if ($request->email) {
            $member->email = $request->email;
        }
       
   
        if ($request->address) {
            $member->address = $request->address;
        }

        if ($request->hasFile('image')) {

            $image   = $request->file('image');
            $imageFileName   = 'image_' . time() . '.' . $image->getClientOriginalExtension();

            if (env('APP_ENV') == 'local') {
                // development
                $request->image->storeAs('public/uploads/members', $imageFileName);
            } else {
                // production
                $request->image->move('storage/uploads/members', $imageFileName);
            }
            $member->image = $imageFileName;
        }
        $member->save();

        $member->save();
        return Member::where('id', $member->id)->with('section')->first();
    }

我尝试了很多可能的解决方案，但没有成功。我是 vuejs 新手。

Answer 1

我已经使用这个解决方案解决了这个问题

  axios
.post("/api/members/" + formValues.value.id, formData, {
  headers: {
    "Content-Type": "multipart/form-data",
  },
  params: {
    _method: "put",
  },
})