Heim > Fragen und Antworten > Hauptteil
Ich versuche, Informationen vom React-Frontend mit formData hochzuladen. Ich habe das Backend mit Postman überprüft und alles ist in Ordnung, aber formData leitet die Datei nicht an das Backend weiter. Das ist mein Code
Reagieren Sie auf Front-End-Komponenten
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
Backend-Controller
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)
在此处输入代码
Standardbenachrichtigungsroute exportierenIch habe das Backend für alle Fälle hochgeladen, aber laut meinen Tests funktioniert alles im Backend einwandfrei, alle Schalter und Zustände funktionieren einwandfrei, aber ich glaube nicht, dass Axios die Daten über die erstellte Route in der MySQL-Datenbank veröffentlicht Die Datenbank enthält nur zwei Spalten, „assigned_to“ und „message“.
P粉8608979432023-09-13 19:02:19
问题是表单数据方法没有附加到输入值上;我创建了一个具有不同名称的对象,并将对象名称传递给axios方法,这样就可以正常工作了。还从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) }) }