Rumah > Soal Jawab > teks badan
Saya cuba memuat naik maklumat dari React frontend menggunakan formData, saya menyemak bahagian belakang menggunakan posmen dan semuanya baik-baik saja, tetapi formData tidak menghantar fail ke backend. Ini kod saya
Bertindak balas terhadap komponen bahagian hadapan
import axios from 'axios' import React, { useState } from 'react' function NotificationSecond() { let server = "http://localhost:3456"; let address = `${server}/user/notification` const [Data, setData] = useState({ assigned_to:"", message:"" }) const [response, setresponce] = useState(); let submitter = (e)=>{ e.preventDefault(); let forForm = new FormData(); forForm.append('assigned_to',Data.assigned_to) forForm.append('message',Data.message) axios({ method:"post", url:address, data:forForm, headers: {"Content-Type": "multipart/form-data" }, }).then((data)=>{ setresponce(data.data) }).catch((err)=>{ console.log(err) }) } let inputHandler = (e)=>{ switch (e.target.value) { case "assigned_to":setData((pre)=>{return {...pre,assigned_to:e.target.value}}) break; case "message":setData((pre)=>{return {...pre,message:e.target.value}}) break; default: break; } } if(response){ return}else{ return (this is response
) } } export default NotificationSecond
Pengawal Belakang
import Econnection from "../server.js"; let notification =(req,res)=>{ const {assigned_to,message}=req.body let value = [assigned_to,message]; let notificationAdder = `INSERT INTO notification(assigned_to,message) VALUES (?)`; Econnection.query(notificationAdder,[value],(err)=>{ if(err){ console.log(err) res.send('上传通知不成功') }else{ res.send({ forThanking : `上传成功,谢谢!`, forHomePageReturn: `点击这里返回首页` }) } }) } export default notification;
后端路由 import express from 'express'; import notification from '../Controaller/noticationControler.js'; let notificationRoute = express.Router(); notificationRoute.post('/notification',notification)
在此处输入代码
Eksport laluan pemberitahuan lalaiSaya memuat naik bahagian belakang, untuk berjaga-jaga, tetapi mengikut ujian saya, segala-galanya di bahagian belakang berfungsi dengan baik, semua suis dan keadaan berfungsi dengan baik, tetapi saya tidak fikir axios menerbitkan data ke pangkalan data mysql melalui laluan dibuat , pangkalan data mengandungi hanya dua lajur, "ditugaskan_kepada" dan "mesej".
P粉8608979432023-09-13 19:02:19
Masalahnya ialah kaedah data borang tidak dilampirkan pada nilai input; Saya mencipta objek dengan nama yang berbeza dan menyerahkan nama objek kepada kaedah axios dan ia berfungsi dengan baik. Juga mengalih keluar bahagian pengepala daripada axios.
let file = { assigned_to: Data.assigned_to, message : Data.message } axios({ method:"post", url:address, data:file, }) .then((data) => { setresponce(data.data) }) .catch((err) => { console.log(err) }) }