這是我的代碼,我使用 vuejs 和 laravel。我正在做的功能是保存課程并匯入 Excel 檔案以獲取檔案中的資料。但是保存Course的時候是正常的,但是運行validate excel檔案行的時候卻沒有收到錯誤。即使我給它起了個名字,console.log 出來了。你能幫我修一下嗎?非常感謝。
組件 - 模板標簽
<form @submit.prevent="store()" @keydown="form.onKeydown($event)">
<div class="form-group">
<label class="form-label">Courses</label>
<select class="form-control" name="education_program_course" v-model="form.education_program_course">
<option value="" disabled selected="">Select option</option>
<option value="" disabled>-------</option>
<option v-for="course in courses" :key="course.course_code" :value="course.course_code">{{ course.course_name }}</option>
</select>
</div>
<div class="form-group">
<label class="form-label">Excel File</label>
<input type="file" class="form-control" id="file_data" name="file_data" ref="fileupload" @change="onFileChange">
</div>
<div class="card-footer text-right">
<button :disabled="form.busy" class="btn btn-success btn-lg mt-1" type="submit">Save</button>
</div>
</form>
組件 - 腳本標簽
export default: {
data() {
return {
file_data: "",
form: new Form({
education_program_course
}),
},
methods: {
onFileChange(e) {
this.file_data = e.target.files[0];
},
store() {
this.form.busy = true;
let formData = new FormData();
formData.append('file_data', this.file_data);
this.form.post('../../api/admin/program/education', formData, {
headers: { 'content-type': 'multipart/form-data' }
})
.then(res => {
if(this.form.successful){
this.$snotify.success('Sucessful!');
this.form.clear();
this.form.reset();
}
})
.catch(err => {
this.$snotify.error(err.response.data.errors.file_data[0]);
});
},
}
}
}
控制器
$data = $request->validate([
'education_program_course' => ['required'],
'file_data' => ['required', 'file', 'mimes:xls,xlsx']
]);
$program = new EducationProgram();
$program->education_program_course = $data['education_program_course'];
$path = $request->file($data['file_data'])->getRealPath();
Excel::import(new ProgramDetailImport, $path);
uj5u.com熱心網友回復:
您應該在表單資料上附加“education_program_course”。
formData.append('education_program_course', this.form.education_program_course);
uj5u.com熱心網友回復:
我已經解決了這個問題。更改腳本標記處的更改 ->store()
從:
let formData = new FormData();
formData.append('file_data', this.file_data);
到:
if(document.getElementById("file_data").files[0]){
this.form.file_data = document.getElementById("file_data").files[0];
}
添加file_date在form: new Form和洗掉formData的this.form.post。
轉載請註明出處,本文鏈接:https://www.uj5u.com/yidong/372756.html
標籤:拉拉维尔 Vue.js 验证 Vuejs2 laravel-8
