反应提交表单然后重定向问题
react submit form then redirect issue
我有一个提交后必须执行 2 个任务的表单:
- 发送表单数据到服务器
- 重定向到另一个页面
我很难做到这两件事;
第一个很容易使用 <Form action='/blabla'>
完成,但随后我得到一个空白页面,其中包含从服务器端返回的信息作为文本。
第二个也可以使用 <Form onSubmit={handleSubmit}>
和函数轻松完成:
const handleSubmit = (e) => {
e.preventDefault()
fetch('/blabla', {method: 'POST'})
.then(res => res.json())
.then(data => {
history.push('/nextPage')
})
.catch(error => {
alert(error)
})
}
它工作正常,除了没有数据从表单发送到服务器:(
那么,有人可以向我解释一下如何完成上述两项任务吗?
提前致谢:)
如果你也能post就更清楚了。
无论如何,仅从片段中我说您的提取在配置中没有 body
字段,例如:
fetch('/blabla', {
method: 'POST',
headers: {
'Content-Type': 'application/json' // or 'application/x-www-form-urlencoded'
},
body: JSON.stringify(data), // adjust this according to Content-Type header
})
这可能是没有数据发送到服务器的原因。
我有一个提交后必须执行 2 个任务的表单:
- 发送表单数据到服务器
- 重定向到另一个页面
我很难做到这两件事;
第一个很容易使用 <Form action='/blabla'>
完成,但随后我得到一个空白页面,其中包含从服务器端返回的信息作为文本。
第二个也可以使用 <Form onSubmit={handleSubmit}>
和函数轻松完成:
const handleSubmit = (e) => {
e.preventDefault()
fetch('/blabla', {method: 'POST'})
.then(res => res.json())
.then(data => {
history.push('/nextPage')
})
.catch(error => {
alert(error)
})
}
它工作正常,除了没有数据从表单发送到服务器:(
那么,有人可以向我解释一下如何完成上述两项任务吗? 提前致谢:)
如果你也能post就更清楚了。
无论如何,仅从片段中我说您的提取在配置中没有 body
字段,例如:
fetch('/blabla', {
method: 'POST',
headers: {
'Content-Type': 'application/json' // or 'application/x-www-form-urlencoded'
},
body: JSON.stringify(data), // adjust this according to Content-Type header
})
这可能是没有数据发送到服务器的原因。