为什么我的 laravel jetstream vue 表单请求给了我一个空的休息

Question

我正在处理一个 laravel jetstream 项目，我希望能够导入一个将放入数据库的 excel 文件。现在的问题是在我的控制器中 $request->all();给我一个 null 的响应

控制器：

    {

        dd($request->all());
        // $validator = Validator::make($request->all(), [
        //     'file'  => 'required|max:50000'
        // ]);

        // if ($validator->passes()) {
        //     $dataTime = date('Ymd_His');
        //     $file = $request->file('file');
        //     $fileName =  $dataTime .  '-' . $file->getClientOriginalName();
        //     $savePath = public_path('/upload/');

        //     $file->move($savePath, $fileName);

        //     dd($file);

        //     return Inertia::render('Import/Show')->with(['success' => 'Bestand Succesvol opgeslagen.']);
        // } else {
        //     dd($validator->errors()->all());
        //     return Inertia::render('Import/Show')->with(['errors' => $validator->errors()->all()]);
        // }
    }

Vue 组件

<template>
  <app-layout>
    <template #header>
      <h2 class="font-semibold text-xl text-gray-800 leading-tight">Import</h2>
    </template>

    <div class="max-w-7xl mx-auto py-10 sm:px-6 lg:px-8">
      <form
        @submit.prevent="submit"
        method="post"
        enctype="multipart/form-data"
      >
        <jet-label for="file" value="Kies Excel bestand om te uploaden!" />
        <input type="file" id="file" v-on:change="onFileChange" />
        <br />
        <jet-button> Verstuur </jet-button>
      </form>
    </div>
  </app-layout>
</template>

<script>
import AppLayout from "./../../Layouts/AppLayout";
import JetButton from "./../../Jetstream/Button";
import JetInput from "./../../Jetstream/Input";
import JetLabel from "./../../Jetstream/Label";
import JetFormSection from "./../../Jetstream/FormSection";

export default {
  components: {
    AppLayout,
    JetButton,
    JetInput,
    JetFormSection,
    JetLabel,
  },

  data() {
    return {
      file: "",
    };
  },

  methods: {
    onFileChange(e) {
      console.log(e.target.files[0]);

      this.file = e.target.files[0];
    },
    submit() {
      console.log(this.file);
      this.$inertia.post(route("import.process", this.file));
    },
  },
};
</script>

我想知道我做错了什么，因为现在我无法继续将内容实际放入我的数据库中。

Answer 1

你应该改变你的数据（）

data() {
        return {
            form: this.$inertia.form({
                file: '',
            }),
        }
    },

然后这样调用帖子

this.form.post(route('import.process'), {
   //your logic
});