Add a photo to the storage and database

I can't understand why my controller receives the image field as an empty {} object. Does anyone know how the image file can be transferred from the vue form?

Vue component

				<form @submit.prevent="submitForm(user.id)">
					<div class="mb-3">
						<div class="d-flex justify-content-center mb-3 border">
							<img :src="previewImageSrc" class="card-img-top rounded-2" style="width: 286px; height: 10rem"
							     alt="none image">
						</div>
					</div>
					
					<div class="mb-3">
						<label for="image">Image:</label>
						<input type="file" id="image" class="form-control-file" @change="handleImageChange">
					</div>
				</form>

				<script>
					import AdminSidebar from "@/components/AdminSidebar.vue";
					import AxiosInstance from "@/services/AxiosInstance";
					import {roleValidation, nameValidation, emailValidation} from "@/Validation/user";
					import Swal from "sweetalert2";
					import router from "@/routes/router";

					export default {
						name: "UserUpdatePage",

						components: {AdminSidebar},

						data() {
							return {
								user: {},
								roles: {},
								errors: {},
								previewImage: null,
							}
						},
						
						methods: {
							handleImageChange(e) {
								this.previewImage = e.target.files[0];
								this.user.image = this.previewImage;
							},
	
							getUser(id) {
								AxiosInstance.get(`/users/${id}/show`).then((res) => {
									console.log(res)
									this.user = res.data;
								});
							},
	
							getRoles() {
								AxiosInstance.get(`/roles`).then((res) => {
									this.roles = res.data
								})
							},
	
							submitForm(id) {
								this.errors.role = roleValidation(this.user.role.id);
								this.errors.name = nameValidation(this.user.full_name);
								this.errors.email = emailValidation(this.user.email);
		
								if (!this.errors.role && !this.errors.name && !this.errors.email) {
									AxiosInstance.put(`/users/${id}/update`, {
										'user': this.user
									})
										.then((res) => {
											router.go(-1);
										})
										.catch(() => {
											Swal.fire({
												icon: 'error',
												title: 'Something went wrong...',
												text: 'Incorrect data entered!',
												timer: 2500,
												showConfirmButton: false,
											});
										});
								}
							}
						},

						mounted() {
							const userId = this.$route.params.id
	
							this.getUser(userId)
							this.getRoles()
						},

						computed: {
							previewImageSrc() {
								if (this.previewImage) {
									return URL.createObjectURL(this.previewImage);
								} else {
									return 'http://localhost:85/storage/images/default-image-for-user.png';
								}
							}
						},
					}
					</script>

UserController.php

					public function update($id, Request $request) {
    						$isPolicy = Auth::guard('sanctum')->user();

    						try {
        						$this->authorize('canViewPlants', $isPolicy);
    						} catch (\Exception $e) {
        						return response()->json(['message' => 'Ця дія можлива лише для адміністрації']);
    						}

    						$user = User::findOrFail($id);
    						$requestData = json_decode($request->getContent(), true);

    						if ($request->hasFile('user.image')) {
        						$image = $request->file('user.image');
        						$user->image = $image->store('images', 'public');
    						} else {
        						$user->image = 'images/default-image-for-user.png';
    						}

    						$user->full_name = $requestData['user']['full_name'];
    						$user->email = $requestData['user']['email'];
   						$user->role_id = $requestData['user']['role']['id'];

    						$user->update();
						}